Activity

  • Stephen started the question Adding Custom Icon Fonts in the forum OneSocial theme 8 years, 2 months ago

    Hi guys,

    Tried this in a number of different ways.

    1.

    – Added my own custom font files to the fonts folder, call it, onesocialdemo.
    – Added my stylesheet in the css folder.
    – Added the following to the theme-functions.php

    // OneSocial icon fonts.
    wp_register_style( ‘icons’, $CSS_URL . ‘/onesocialdemo-icons.css’, array(), ‘1.0.2’, ‘all’ );
    wp_enqueue_style( ‘icons’ );

    – I then tried styling some obvious areas, the search icon for instance, in the child-themes custom.css, and it didn’t work.
    – I then tried it in custom codes area in the admin panel and it threw me the following error:

    “Unsafe strings were found in your CSS and have been filtered out.”

    – It seems it didn’t like the backslash in:

    content: “e900”;

    2.

    – As such, I then tried to overwrite the existing onesocial font files/stylesheet by uploading the svgs to icomoon. I added the icons I wanted and omitted the according icons from the original set. I also, replicated the names and characters to match the original set that I was replacing.

    – When I generated the font however, the output was still characterized as:

    .bb-icon-camera:before {
    content: “61”;
    }

    Instead of:

    .bb-icon-camera:before {
    content: “a”;
    }

    – I couldn’t find a way to resolve this with any of the icon generators.

    – The last step I tried was overwriting just the original font files (eot, svg, ttf, off) with the new output which resulted in no changes.

    Are there any missteps I’m taking here or recommended best practice for doing what I am attempting to do?

    Thanks