Error with Cart Icon on Menu

  • Jethro Burnett Thorburn

    (@happyhealthyhonesthuman)


    5 years, 4 months ago

    Good Day,

    The Cart/Basket icon on the main menu of my Woocommerce site is not working properly. The icon does not display properly on any page EXCEPT on the Shop page where it displays correctly.

    Important thing to note is that I recently updated the page builder I use (Elementor) and the latest update featured an update from Font Awesome 4 to Font Awesome 5. I am wondering whether this has contributed to the error and what a possible fix could be? Or whether this is unrelated? Quite weird that it still works on the Shop page (https://molomarket.com/the-market).

    I have also contacted Elementor Support to see whether I can roll back to Font Awesome 4 to get more infromation as to whether that was in fact the root cause of the error. However, their documentation says that once the process has been done it cannot be undone, so I am wondering what a possible solution is?

    I’d appreciate any other help.

    Please see screenshots at the link below:

    Menu Cart Icon Error

    Thank you!

    Kind regards,
    Jethro

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

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

  • Hello,

    Try adding the below code to the customize > custom css section and check it works or not –

    .fa {
    font: normal normal normal 14px/1 FontAwesome !important;
}
    Thread Starter Jethro Burnett Thorburn

    (@happyhealthyhonesthuman)

    Hello Amit,

    Thank you kindly. It worked!

    This is not the first time you have helped me. Thank you very much Sir.

    Kind regards and best wishes,
    Jethro

    You’re welcome!

    Thread Starter Jethro Burnett Thorburn

    (@happyhealthyhonesthuman)

    Hi Amit,

    Just checking in again.

    It seems that the custom css is affecting other font awesome icons used elsewhere on the website.

    My apologies, I should have mentioned that I have other areas on the website that use font awesome icons because they are used by my page builder, Elementor.

    Is there some way that the custom css can be applied only to the header section of my site? This is where the main menu is and the main menu has the cart/basket icon.

    Thank you!

    The above solution is a temporary solution. We are working on to upgrade the font-awesome version in the theme. After that, all the icon issue will be fixed. For now please try the below code – 

    #site-header .fa {
    font: normal normal normal 14px/1 FontAwesome !important;
}
    Thread Starter Jethro Burnett Thorburn

    (@happyhealthyhonesthuman)

    Hey Amit,

    Worked a charm! Thank you kindly!

    Will keep an eye out for the update.

    Feel free to mark as resolved.

    Hope you’re having a good day.

    Kind regards,
    Jethro

    Sure, we will update soon.

    Thank you for this too~!

    I built 1 site and thought it had to do with the Font Awesome script I disabled to speed up the website. Or, Elementor Font Awesome v4 compatibility settings. So I left the icon as the default bag as it fitted the site’s design.

    However, when I’m working on another site now. I really needed the solid trolley icon instead – it was missing. Thanks to this CSS, it finally shows up now.

    Hopefully the next release will fix this.

    Paid OWP customer here – <3 it. Looking forward to greater things.

    Mike

    (@lonfeldt)

    I also had issues with the missing shopping basket in the menu.

    My solution was:

    – deselect Font Awesome Icons in OceanWP Script & Styles
    – save changes
    – clear cache
    – select Font Awesome Icons again in OceanWP Script & Styles
    – save changes
    – clear cache

    And the shopping was back in the menu again.

    BR Michael

    jrossjord

    (@jrossjord)

    I am having problems with my cart icon, not sure if it’s a similar issue.

    I have product variations with different prices. The checkout shows everything fine but the cart icon, if you hover over it, shows the wrong price.

    https://grjordan.com

    Any ideas?

    Hi
    My site is aevenr.com and it’s cart also showing square box.. I can’t fix this please help me.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Error with Cart Icon on Menu’ is closed to new replies.

Tags