Showing the cart only on the shop pages

Hi all

Ok so I have a shop I am building and its looking good. I want the cart to display on the shopping pages but not anywhere else in the site. How do I do that?

It's difficult to understand why you might want to do this because you haven't provided a link to the site to give us any context, but I don't recommend selectively hiding the cart icon.

For a good user experience, it's a good idea to follow the principle of least surprise. The cart icon serves as an important identifier to check out or view cart items and its location should therefore be the same on all views. This ensures that users don’t have to think about how to navigate to make a purchase.

If you still really want to do this, please provide a link to a working link to the site (with a password if required) so that the community can help you further.

Hi Paul2009 and thanks os much for your reply.

I apologize, new here on the forum and squarespace so the etiquette and ways of doing things are a little new to me but hopefully I can learn quickly.

I would love to still have the cart only show in the shop. The reason why is that the site is operating kind of two-fold so theres a main page and then there will be two images with a hvoerover. One will go to the shop and the other to a different page showing info, they are sort of unreleated hence the need to show the cart only in one section. I also do not have a menu so all pages are unlinked and thats on purpose also.

OK so the site hasn't finished being built yet and is private but the url is https://goose-turbot-zsg4.squarespace.com/home and I have just made a password which is Testing

The page I want to keep the cart (which is presednt now) is https://goose-turbot-zsg4.squarespace.com/shop

The page I wish for it to be hiddne or taken away is https://goose-turbot-zsg4.squarespace.com/hdt

Any help with this very much appreciated.

Add the following to Design > Custom CSS.

/* hide cart icon on hdt page */

#collection-5fceee815c8977691e2fa2d2 .header-actions-action--cart {

  display: none;
  
  }

Let us know how it goes.

@creedon this is awesome thanks so so much, totally worked!

@creedon I just tried your solution for displaying the Cart icon only in my shop, but it didn't work (likely user error!). Can you help me with my site? brightwayslearning.org/shop.

Thanks in advance!

On 1/16/2021 at 5:39 AM, TinaHamilton said:

@creedon I just tried your solution for displaying the Cart icon only in my shop, but it didn't work (likely user error!). Can you help me with my site? brightwayslearning.org/shop.

Thanks in advance!

Add to Design > Custom CSS

body:not(.collection-type-products) a.Cart {
    display: none;
}