Fontawesome

  • JamesD
    JamesD
    Super Guru 1,289 points

    @Pierre-Gilles
    Good news… you have a couple options!
    Option #1 Use Elementor Pro Custom Fonts
    If you have a Pro license then there is an option to add Custom Fonts.

    Option #2 Use A Font Awesome Kit
    FA recently released Kits to make things easier to setup and maintain. Just one script is needed to handle all required files. It’s actually pretty nice. Free users/license can create 1 hosted kit and Standard license are allowed 30.

    You can create a kit on Font Awesome Website .

    add_action( 'elementor/frontend/after_register_scripts', function(){
        wp_dequeue_style('font-awesome');
        if (! wp_script_is('v5-fontawesome', 'registered')) {
            wp_register_script('v5-fontawesome',
                'REPLACE_WITH_FA_KIT_URL',
                array (),
                false);
            wp_enqueue_script('v5-fontawesome');
        }
    });

    Option #3 Place this code in your _functions.php file:

    add_action( 'elementor/frontend/after_register_scripts', function(){
        wp_dequeue_style('font-awesome');
        if (! wp_style_is( 'fa-all-css', 'registered' ) ) {
            wp_register_style('fa-all-css', 'https://use.fontawesome.com/releases/v5.9.0/css/all.css');
            wp_enqueue_script('fa-all-css');
        }
        if (! wp_style_is( 'v4shims-css', 'registered' ) ) {
            wp_register_style('v4shims-css', 'https://use.fontawesome.com/releases/v5.9.0/css/v4-shims.css');
            wp_enqueue_script('v4shims-css');
        }
        if (! wp_script_is('fawesome-solid', 'registered')) {
            wp_register_script('fawesome-solid', 'https://use.fontawesome.com/releases/v5.9.0/js/solid.js', null, '5.9.0');
            wp_enqueue_script('fawesome-solid');
        }
        if (! wp_script_is('fawesome-brands', 'registered')) {
            wp_register_script('fawesome-brands', 'https://use.fontawesome.com/releases/v5.9.0/js/brands.js', null, '5.9.0');
            wp_enqueue_script('fawesome-brands');
        }
        if (! wp_script_is('fawesome-min', 'registered')) {
            wp_register_script('fawesome-min', 'https://use.fontawesome.com/releases/v5.9.0/js/fontawesome.js', null, '5.9.0');
            wp_enqueue_script('fawesome-min');
        }
    });

    Note: FA v4 icons are known to cause conflicts with v5 when running together, however the solution also includes a Shim script offered by FA that helps them play together a little more nice. Due to the nature of this you should test, double-check and review the icons to make sure they’re not broken/missing. I believe Elementor is working on updating to v5 sometime in a near-future release.

    June 10, 2019 at 4:24 am
  • Didn't find what you were after?

    Chat with us now

    or contact our support team