[Resolved] woocommerce cart icon in menu

[David]

I have noticed on several sites the cart in appears in the menu. Anyone figured out how to make this work with GP?

Thanks!

[Tom]

Hi David,

You can just add a Custom Link to your menu item and add the HTML for the cart icon: http://fortawesome.github.io/Font-Awesome/icon/shopping-cart/

Let me know if that works or not 🙂

[Jorge]

I want to do the same, however I’m super new to GP and WordPress in general. No idea of how to add that Custome link. Hope you can help me.

[Stacey Usborne]

Hi,

This article might be helpful to create a custom link: https://generatepress.com/knowledgebase/using-menus/

[Rachel]

I’ve tried both solutions here and neither work to add the Woocommerce Cart icon into the munu nav bar

http://fontawesome.io/icon/shopping-cart/

<i class=”fa fa-shopping-cart” aria-hidden=”true”></i>

Where do I enter the html code?

http://www.divi-magazine.com/fix-for-the-woocommerce-shopping-cart-icon-in-main-menu/

Appearance > Menus > Screen Options > Advanced Menu Properties > CSS Properties -> checked

Shop > CSS Classes (Optional) ->

.et-fixed-header #et-top-navigation .et-cart-info {
margin-top: 5px;
}

https://wordpress.org/support/topic/virtue-woocommerce-cart-icon-position/

.kad-cart-total {
position: relative;
}
.cart-contents {
text-indent: -9999px;
min-width: 10px;
}
.cart-contents .amount {
text-indent: 0;
position: absolute;
right: 10px;
}
.cart-contents .amount:before {
font-family: FontAwesome;
font-weight: 400;
font-style: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;
line-height: 1;
text-transform: none;
content: “\f07a”;
padding-right: 10px;
}

[Tom]

Hi there,

You just need to add the icon into your Navigation Label. More info on that here: https://docs.generatepress.com/article/adding-icons-to-menu-items/

[Ray]

Hi Tom,

In reading the info above, I don’t see a way to access the ‘cart’ to replace ‘text’ with an ‘icon’, when it does not show in the customizer menu. How do I replace the text ‘cart’ with an icon?

Thank you!

[Leo]

Hi there,

The cart icon should show up by default if you have it activated in the WooCommerce module:
https://docs.generatepress.com/article/woocommerce-overview/#general

And you also need to make sure that load essential icons option is not checked here:
https://docs.generatepress.com/article/general-settings-overview/

[Author]

Posts