Support » Theme: Customizr » Icons from Font Awesome dissapeared

  • candreu

    (@candreu)


    With the last update, the custom icons for some widgets dissapeared. How can I use Font Awesome 5 from CSS?

    The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)
  • Pluh

    (@pluh)

    Icons are now updated to Font Awesome 5, and they have a different syntax. So if you’ve added an icon anywhere manually, you’ll have to update the code
    From:
    <i class="fa fa-accessible-icon"></i>
    <i class="fab fa-accessible-icon"></i>
    for brands
    and
    from fa to faS for other icons

    • This reply was modified 6 months ago by  Pluh.

    Hi there,
    as Pluh said, the font awesome icon set is now updated to Font Awesome 5.
    You can find how to use the Font Awesome 5 icons, for your custom icons, on the official website
    https://fontawesome.com/

    Hope this helps.

    candreu

    (@candreu)

    My problem is with CSS. I have this code:

    #w4_post_list-2 h3:before {
    font-family: ‘Font Awesome 5 Free’;
    speak: none;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding-right: 5px;
    top: 1px;
    font-size: 1em;
    position: relative;
    content: ‘\f005’;
    }

    With \f005 it works (it shows a star), but not with another ones (for example, \f05a for info circle).

    andrew55

    (@andrew55)

    I have same issue as @candreu

    As a temp fix, I disabled FA in customizr and put this in functions.php

    //enqueues our external font awesome stylesheet
    function enqueue_our_required_stylesheets(){
    	wp_enqueue_style('font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); 
    }
    add_action('wp_enqueue_scripts','enqueue_our_required_stylesheets');

    Would still love to get suggestions from some css masters.

    Hi there,
    Font Awesome 5 solid icons “need” the font-weight to be set to 900.
    The info circle icon, as you can see here:
    https://fontawesome.com/icons/info-circle?style=solid
    is a solid icon.

    Hope this helps.

    candreu

    (@candreu)

    Thank you, it was the solution. One more thing: which is the value for font-weight with brands icons?

    marpat

    (@marpat)

    For me the problem went away, when checking the box in WP Dashboard

    Appearance -> Customizr -> Advanced Options -> Front end icons ( Font Awesome )

    as suggested in:
    http://docs.presscustomizr.com/article/233-social-icons-showing-up-as-squares

    Tnx marpat! So simple 😉

    You are welcome! Simple indeed – finding it, not so simple 😉

    Why did it work without checked box in versions before? I do not know…

    thehairypotato

    (@thehairypotato)

    Thank you – the fix for me was to turn on the FA icons in the Advanced Options! Weird, I wasn’t having issues though when I first installed Customizr but I’ve made some changes since then.

    thehairypotato

    (@thehairypotato)

    I was still seeing issues but I removed the minify CSS scripts that I set up last night and it seemed to fix the issues. I have so much going on between memcached, Cloudflare, etc. that I’m guessing something stepped on something else.

Viewing 11 replies - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.