Google Lighthouse still complains about Fontawesome

Hello,

I just installed Bricks 2.2RC on my own website and Google Lighthouse is still whining about Font Awesome fonts, but I toggled off all of them in the Icon Manager. The website only uses SVG for icons. What could be the reason for that? https://dmwc.me/

Thanks for any help!

Dirk

1 Like

It is because you are using it within your design.

Your FAQs arrow is Font Awesome because you are using it in the accordion.

Your slider arrows are Font Awesome as well.

Look at your code and you will see where it is being used and then you can changed it. Just because you disabled it, does not mean it removes it from every instance of it. You have to go do that yourself (this is so things don’t break when you made that disabled).

1 Like

Thanks! You are right for the slider, I really used the library. Wasn’t aware. There seems to be another problem, that Bricks Extras (Accordion) still loads Fontawesome, even if I used SVG. Could solve it by blocking Fontawesome completely.

2 Likes

Glad you found the one issue with the slider. Maybe also reach out to the developer of BricksExtra and see what they say.

You could also try dequeue Font Awesome … something like this.

function dequeue_font_awesome() {
    wp_dequeue_style( 'font-awesome' );
}
add_action( 'wp_enqueue_scripts', 'dequeue_font_awesome' , 99 );

Yes I will talk to them, keep you posted. I used this code I got from Claude AI:

// dequeue Font Awesome

function prevent_fontawesome_loading() {
    // Loop through all enqueued styles
    foreach (wp_styles()->queue as $style_handle) {
        if (strpos($style_handle, 'font-awesome') !== false) {
            wp_dequeue_style($style_handle);
            wp_deregister_style($style_handle);
        }
    }

    // Loop through all enqueued scripts (if there are Font Awesome scripts)
    foreach (wp_scripts()->queue as $script_handle) {
        if (strpos($script_handle, 'font-awesome') !== false) {
            wp_dequeue_script($script_handle);
            wp_deregister_script($script_handle);
        }
    }
}
add_action('wp_enqueue_scripts', 'prevent_fontawesome_loading', 20);

Very good … keep us posted.

Cheers

Hi shingen, so Bricks Extras says, they have nothing to do it it:

BricksExtras doesn’t control the output of the inner contents of the nestable elements.

We basically tell Bricks the structure to add inside when the element is first added, and then Bricks adds it in when you add the element to the page and controls the output of the native elements from there. The ‘toggle icon’ is just an icon element.

The default setting for that icon in the structure is actually an Ionicon arrow (see screenshot), not FontAwesome.

From your screenshot it looks like the SVG is being added, but the SVG code itself is from Font Awesome and so comes with the Font Awesome comment inside of the SVG. It’s not the Font Awesome font family that comes with Bricks icon sets.

I created a testpage with only one SVG:

Take a look: Test Fontawsome » DMWC

Can you make sense out it? Sorry this is a bit over my head :slight_smile:

Thanks!

Dirk