Customising the cart icon and shop page font

[jamiewaller]

I would like a bit of help. I am creating a e-commerce website and I would like to change a few things. I am using Integrity.

1. The cart icon doesn’t seem to work. I have tried to change it but it wont change it. How do I do that?
   

   

2. How do I change the colour and font of the price, and change of the font name of the product?

3. And then I would like to remove the shadow bow below the product in the shop page and the single product page.

If I have to use CSS where do I put it? Do I use it under Appearance > Customise or under Cornerstone ?

Thank you

[ruenel]

Hello Jamie,

Thanks for writing in!

1.) The WooCommerce cart is using fragments. This gives every person a unique cookie and tracks their cart contents throughout the website. This way when you are using server side caching, the content of the cart can be visible without the customer needing to visit the /cart/ page. After changing the cart settings in X > Theme Options > WooCommerce, it is best that you clear your cache first or only test your site using private browsing mode.

2.) The color of the price and it’s font name depends on the global typography setting and the link color settings which you can change it in X > Them Options > Typography > Body and Content and in X > Them Options > Typography > Body and Content > Site Links.

3.) There is no option in the theme to be able to remove the shadow below the product in the shop page and the single product page… You need to add CSS code into X > Theme Options > CSS . You need to use the Google Chrome Developer Toolbar to check the live HTML code and find which CSS selector you need to use.

The product items in the shop page uses .woocommerce li.product class selector and in the single product page, .entry-wrap class selector of the container and therefore a proper CSS selector to be able to remove the box shadow will be:

.woocommerce li.product,
.entry-wrap {
  box-shadow: none;
}

The sample code above will be a good starting point and if you are interested you can learn more about CSS selectors and details here

Hope this helps.

[jamiewaller]

Thanks so much! This is really helpful!

[christian]

You’re welcome, Jamie. Glad to hear that we’re able to help.