Icons disappeared after update

I’ve just had a look at your website but couldn’t replicate the same thing. On my side, the icons are all showing up as expected:

Link to image: https://cld.wthms.co/exnyDj

Have you tried clearing your browser cache to see if that resolves the issue?

The icons which disappeared are, 1 on the mobile menu when you toggle to reveal hamburger menu (.storefront-hamburger-menu-active .shm-close ) and the single product page social sharing buttons (.storefront-product-sharing). I have cleared the cache but that doesn’t seem to solve the problem

According to the README.txt for v. 2.3.1:

“Made changes to icons.scss to address an issue where Font Awesome icons were not being displayed correctly on some sites.”

It hasn’t helped with one of my sites. The Font-Awesome icons are still not showing up. I think that may be the same problem you’re having.

I have one site that isn’t affected because it’s running another plugin (YITH Woocommerce Wishlist) that loads the Font-Awesome CSS, so it looks like there is a bug with Storefront that prevents the Font-Awesome icons for displaying. A temporary workaround would be to load the Font-Awesome CSS another way.

Update 2.3.1 has not solved it either on my site too. I think it will work looking for how to load them in another way.

There is, in fact, and issue with Storefront Hamburger Menu. The close button (X) does not properly render.

I have been unable to locate any issues with menu icons not rendering properly when using only Storefront and its child-themes.

I have reported this bug to the developers at https://github.com/woocommerce/storefront-hamburger-menu/issues/8

@abanista – I tried adding the Font Awesome stylesheet link to Storefront’s header.php, thinking that it would solve the problem, then be overwritten when the new (hopefully fixed) version comes out, but it didn’t work.

What did work was installing the Better Font Awesome plugin. My icons were back.

It seems like that’s a fast, easy fix until Storefront is fixed. That also seems to have fixed the issue with the close icon in the hamburger menu, if I’m looking at the same thing reported above.

I noticed for me, the issue after the update seemed to be no font family or it was being overwritten. I added the below code to my storefront child theme css and fixed the problem.

i {
  font-family: fontawesome;
}

@winters,

you said:

the issue after the update seemed

You mean the 2.3.0 update, or the 2.3.1 update?

Oh, sorry for not clarifying. It has been broke for me since the 2.3.0 update and remained broken in the 2.3.1 update.

@abanista in this case, the issue was with Storefront Hamburger Menu as @hometowntrailers indicated earlier.

@winters – The problem is that SF2.3 is already using FontAwesome 5, but that’s not the case with the SF Hamburger Menu, and this mini-extension was targetting the wrong font-family because of it.

I’ve submitted a pull request with a fix.

Link to image: https://cld.wthms.co/yBN2WG

https://github.com/woocommerce/storefront-hamburger-menu/pull/9

I’ll be marking this thread as resolved. You can follow-up on the GitHub issue.

• This reply was modified 6 years, 10 months ago by Job a11n.

Thank you @jobthomas. The icons for plugin storefront product sharing have also disappeared since.

Hey, that’s been reported here already: https://github.com/woocommerce/storefront-product-sharing/issues/7