Archived topic
Shopping Cart icon options
3 replies · Started by Edward on October 29, 2017
I am able to add in dashicons or fontawesome icons to my main nav menu, and change the size, which is really cool. A mystery here is the Cart icon to the right of my main nav menu. This is the CSS I am using to customize the size menu icons, and their position relative to the text.
.menu-item .dashicons {
display: inline;
height: auto;
width: auto;
line-height: inherit;
vertical-align: -1px;
padding-right: 2px;
font-size: 18px;
}
Changes in the above CSS do not affect the cart icon, and it is also not included in my Header Rt Menu, which is set to my primary menu. Ideally, I would like to make the shopping cart icon part of my Header Rt Menu.
But here are some of the things I'm trying to achieve
1 Change the cart icon's size, color, and add text to it, as is the option with the other menu items
2 Hide the cart icon
3 Replace the cart icon with some other dash icon, or fontawesome icon
Help on this is greatly appreciated,
Edward Joe
Hi there,
Your site is not working for me. Can you double check?
I assume .dashicons is a custom class added to the menu?
If so can you try this selector? .main-navigation .main-nav ul li.dashicons a
I am using an Under Construction page for the site https://wildmedicines.com I can send you an admin login, if there is a way to do it outside of the forum. And I'm not sure what it means to add a custom class to the menu. I added the following to the Navigation Label in the Menu (Appearance, Menus)
<span class="dashicons dashicons-admin-home"></span>
You can add custom class to menu items then add the CSS to target it.
Similar method to this if you want to give it a shot: https://docs.generatepress.com/article/adding-buttons-navigation/
