[Resolved] Dashicon not displaying in Firefox and Chrome

[Samuel]

Hello,

I have a problem with a simple Dashicon I put in a button : it’s not displaying well on Firefox and Chrome. You can see it here : https://monvoyageencolombie.com

Here is the the CSS I use to do so. Is there any trouble with it ? Any clue on what could cause problem with Dashicon display ? I thought it was like the most standard icons on the market…

.wp-block-button :before {
    content: "\f504";
    -webkit-font-smoothing: antialiased;
    font: normal 25px/1 'dashicons';
    display: inline-block;
    color: #393939;
    height: 30px;
    margin-right: 13px;
    position: relative;
    vertical-align: middle;
    width: 30px;
}

[Leo]

Hi there,

Is that a FontAwesome icon?

How are you loading it?

[Samuel]

Hi Leo,

As it’s mentioned in title of my request and in my message, it’s a Dashicon.

[Leo]

Sorry missed that.

Does it help if you clear and disable the caching plugin first?

Also seeing a bunch of console errors:
https://www.screencast.com/t/CrNSeblH

[Samuel]

No it’s not caching plugin.

I don’t think any of these errors are causing the issue.

Any other idea ?

[Leo]

Hmm not really.

Can you try disabling all plugins to eliminate any conflicts?

What if use a twenty series default theme? Does the icon shows?

[Samuel]

It’s not a plugin conflict either (tested)

Switch to default theme just for that seems a bit too much no ? I can give it a try but I’m pretty sure it’s not going to solve anything.

Do you have a possibility to reproduce the issue using my snipet on your side ?

[Leo]

Switching to the default theme would determine if it’s a theme issue or not.

What if you try the solutions in this post?
https://generatepress.com/forums/topic/dashicons-not-working-with-generatepress-theme/

[Samuel]

Here you go… that was it !

Adding this to function.php

add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
  wp_enqueue_style( 'dashicons' );
}

Thanks !

[Leo]

No problem 🙂

[Author]

Posts