Jump to content

Keep Shopping Cart Icon Visible when not in Main Navigation

Go to solution Solved by tuanphan,

Recommended Posts

Site: https://mackerel-accordion-jehg.squarespace.com/  

Password: 30LS 

Hi, my client wants to sell product on their SquareSpace site, but they don't want the UX to be commerce forward. So I'm testing ways to tone down the commerce details. 

I've found how to remove the shopping cart from the header, and I see that if you 'Add to Cart' something, the shopping cart icon pops up in the lower right of the page. My problem is, when you navigate away from that page, especially to a non-commerce page (such as Advantage) on my site, the shopping cart icon/link goes away, and there is no way to access it again unless you add another product to cart. Is there a way to keep the shopping cart icon in the bottom right permanently once a customer has added something to their shopping cart? 

Screenshot 2023-02-27 at 11.51.39 AM.png

Link to comment
  • Replies 4
  • Views 409
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Hi @tuanphan, thank you for responding - that code worked great. However, it would be ideal if the cart showed up permanently like that only if a visitor added something to their cart. So when they first visit, it would not be there (like it functions default on SquareSpace when not in the main nav), then if they added something to their cart it would show thereafter no matter what page they're on. 

Link to comment
  • Solution
12 hours ago, kpdesign said:

Hi @tuanphan, thank you for responding - that code worked great. However, it would be ideal if the cart showed up permanently like that only if a visitor added something to their cart. So when they first visit, it would not be there (like it functions default on SquareSpace when not in the main nav), then if they added something to their cart it would show thereafter no matter what page they're on. 

Try this new CSS

div#floatingCart {
    display: block !important;
    background: transparent !important;
}
a.icon[aria-label*="0 items"] {
    display: none;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.