Squarespace hide cart when empty Increase your online sales with this step-by-step tutorial! Hide or Replace Add to Cart Button With Custom Link [SQUARESPACE ECOMMERCE TUTORIAL] Sam Crawford | Squarespace Expert 4. in/eUVghmR3 532 followers 139 Posts May 22, 2019 · Easily change the default “nothing in cart” shopping cart text. Use this code to Code Injection > Footer <script> const allLinks = document. Aug 26, 2019 · Do you ever wish you could hide the cart icon on your Squarespace Website while the cart is empty? In this video I show you how to only show the cart icon once an Jan 30, 2020 · Hi Folks Does anyone know a working solution for Squarespace 7. Feb 16, 2021 · Site URL: https://maxishop. sqs-add-to-cart-button-wrapper, . div. cart-row-price { visibility: hidden; } #2. When there are no future events I'd like the summary block to be hidden. That is what it did for me. While this minimalism is elegant, it can confuse users who don’t realize where to go to check out. In a previous video, I showed you how to hide the shopping cart icon in the header when the visitors cart is empty. 00 pricing to change to show 'POA'. What would the code be to do this? Replies7 Views1. Nov 8, 2024 · How to hide the following elements: - Add to Cart button - Quantity area - Price How can I do this? Sep 19, 2023 · Conclusion: There is one simple way to remove or hide the shopping cart from your Squarespace site, and that is to disable the Cart feature in your Site Header Settings. Any ideas on how I can do this? Password: Seagate89 Nov 9, 2021 · Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. 0. Next, assign this tag for all products where you want to hide Add to Cart, Quantity … Jun 2, 2023 · One thing you can try is adjusting the height of your footer section (s). 2. ca/cart i just upgraded our plan for commerce -- im surprised there isn't a feature for 'continue shopping' button in shopping cart . Make the Continue Shopping text appear as a black button with all caps text that says: CONTINUE SHOPPING (same style as the other buttons on my website, see example below. cart-added { display: none !important; } Aug 29, 2024 · Did you know that you can replace the add to cart button with a custom link on Squarespace? Jul 24, 2023 · Squarespace: Hide Section With a Custom Code If you have some knowledge of CSS and are looking to hide a section on your Squarespace website, you can achieve this by using custom code. 0 and I am aware I can hide price for the entire website via Design > Style, but it isn't something that I want. squarespace. First, use this code to Custom CSS li. This plugin uses css editor and works with Squarespace 7. 1k Created4 yr4 yr Last Reply 4 yr4 yr Jan 25, 2025 · To hide Empty Category from Shop Page #1. sqs-add-to-cart-button-wrapper { display: none!important; } After the Products V2 Update has been applied (any site started after June 2025), the Custom CSS is: . However, if there are items in the cart, Squarespace don't add this link. #1. Aug 26, 2019 · FREE TRAINING: Add Code to Your Client's Squarespace Website Hello everybody My name is Rebecca Grace and today we're going to talk about how to only display the cart icon Once something has been placed inside of the cart So for instance you see in the corner, there's this Curt icon with the zero We wanna hide that until somebody actually places something within the court and then it will show Feb 25, 2025 · Learn how to customise your Squarespace add to cart button with CSS! Improve your Squarespace shop experience with hover effects, animations, and styling tips. While you can change the destination URL through the Cart settings, modifying the button's text requires custom code. May 23, 2022 · Learn how to edit the shopping cart page on Squarespace using CSS. CartHeader-cartTitle-9Dk3d { display: none; } It's the same on the Squarespace 7. I have provided the most recent CSS to hide the 'Add to Cart' button here. Meaning, I only want it showing after someone adds a product to card on my site. First, create a tag with name: natc #2. QUESTION: Is there a way for us to auto-hide (not remove, but HIDE) categories that don't have products in it? The Jan 3, 2024 · Hi @Jesse-WMFE Your screenshot shows the Checkout page. I want to remove the the "quantity box" from my products page. Nov 30, 2022 · In a previous video, I showed you how to hide the shopping cart icon in the header when the visitors cart is empty. Is that possible? Nov 21, 2024 · Hey Squarespace Fam! This one is pretty specific but I am trying to alter the message that appears when you add an item to your cart (attaching screenshot) -- I was able to customize the look of the message, but I wanted to change the word Cart to Kart as this company wants to spell it with a K. 19K subscribers Subscribe Mar 17, 2025 · Hi @Sven7, By default, Squarespace's "Continue Shopping" button on an empty cart page directs users to the homepage. DIGITAL including: Product Breadcrumbs Continue Shopping Currencies Favourites Wishlist Age Popup ☕ Buying me a coffee is a generous way to say How to Remove Cart Icon in Squarespace. 1 Hide Prices on all products Tip by sf. product-price { display: none; } You can also hide the cart icon by toggling Oct 15, 2022 · I'm looking to add 6 different product blocks on my music page - I will remove all options from visibly so that I am just left with an "add to cart button". Mar 16, 2024 · Search for jobs related to Squarespace hide cart when empty or hire on the world's largest freelancing marketplace with 23m+ jobs. Apr 23, 2024 · I can't figure out how to remove this blank white space on the right side of my website. 00 and add to cart also still appears on product quick view. 0 sites. 1 and Brine-family templates on Squarespace 7. Is there a way I can do this with a code in May 9, 2024 · toucan-salamander-bmcf. May 3, 2025 · Remove cart from Squarespace, delete cart on Squarespace, Squarespace cart removal, how to get rid of cart on Squarespace, deleting cart from Squarespace, Sq Nov 27, 2024 · I want to hide 'Add To Cart' button on my website. Feb 9, 2023 · How Customize cart page, hide header, footer, sections, change color and Button. Jun 18, 2023 · You can hide a category manually with some CSS because you know the category is empty, but you cannot hide it automatically based on whether there are products in that category. cart-style-icon. Check your site styles to see if your shopping cart is hidden. I would also like to hide the 'shopping cart' header at the top. All Products You can use this to Custom CSS box. To avoid confusion for you later, I should perhaps mention that the page pictured above is the Cart page, not the Checkout page. 1 and I have successfully hidden the quantity, price and add to cart on the site as I don't want people to purchase of it yet, it's working like a catalogue with products marked POA. It's free to sign up and bid on jobs. hide-cate), li. The shop button in the navigation bar hangs over into it. Aug 16, 2020 · Specifically, I had removed the "add to cart" and price from showing on product pages for one of my stores, which is actually a references library. querySelect 3 days ago · If your shopping cart icon isn't showing, look for the following potential causes: Check that your site has at least one product on a store page. Many thanks. plp-grid-add-to-cart, . I added this code in product pages (additional information): <style> div. 0 (Brine template family). Mar 5, 2025 · I seem to be having the same issue again and the code is not working for me I want to move the add to cart button to be below the description with the variants. hide-cate) { display: none !important; } #2. com/shop/p/the-watchersHi! I'd like to hide the Add to Cart button if a product is marked as sold out. I need to add some code to make the add to cart button disappear on these items. Previously, I've hidden the 'Add to Cart' on a specific set of products and directed customers to a 'find a retailer' button instead. digital */ . Feb 16, 2023 · I'm busy designing an online brochure for a client who sells BBQ grills throught Wayfair. This keeps it looking clean and minimizes the chances of users bouncing around your site. a. php file. This page can't be modified so you won't be able to add a button to this page. Luckily, you can customize this behavior to ensure the cart icon appears only when an item is added, giving your store a cleaner appearance while Apr 9, 2025 · To make Add to Cart button disappear after click, you can use this code to Custom CSS box. If you go small it should move closer to the bottom. Let us know how it goes. 1 site pictured above and Squarespace 7. If I visit the page from within Squarespace as I'm building it, the cart indicates 0 items in the shopping The default Squarespace shopping cart page can be a bit limiting when it comes to customization using the design menu. Enabling Express Checkout disables the shopping cart. If you want to only change the footer for the cart page that might be achieved with some JavaScript to tweak the classes of the footer sections to go small height. Jan 25, 2020 · Squarespace Webinars Free online sessions where you’ll learn the basics and refine your Squarespace skills. 😬But thanks to CSS, you can make it u Oct 5, 2021 · If someone arrives in an empty cart, a link is added to help return them to your store. Squarespace offers flexibility in customizing your online store’s appearance and functionality. Jun 28, 2025 · To hide Cart when Cart is Empty. If I visit the page from my own Chrome browser (as a customer), the shopping cart indicates that there are 2 items in it. This will work for Squarespace 7. How do i do that? Thanks in advance. Ensure Express Checkout is disabled in Checkout Settings. Dec 5, 2021 · Hello! My site hasn't launched yet, but there's a pesky issue that I'm trying to remedy before it does. product-price { display: none !important; } </style> Learn how to easily add a shopping cart to your Squarespace website with the best method. Easily hide the price of products on your Squarespace store and product pages with this CSS hack 🔗 Original post:more Mar 24, 2021 · We're currently building a new website for our business, and we've grown fond of Squarespace due to using it for our Coworking space. They want product description pages, but since the products are sold via wayfair and others like it, they don't need price, etc and add to cart (all things typically associated with commerce pages on SS) I f Jan 7, 2023 · Hey All, Simple question. In my example, it is: /store/p/earth-sky-planter-4awkk-nazcb-lbzst Next, use this CSS If you're using Squarespace 7. Old post linked here as well Nov 8, 2025 · Site URL: https://www. These products belong to the same categ Jan 16, 2020 · You can remove the cart title by adding this to Design > Custom CSS: . Aug 16, 2020 · I would like to use the product pages on my site to display my products, but because I am not actually selling online, I need to hide the following elements: Add to Cart button Quantity area Price How do I do this? Version 7. does anyone have any css code that can handle this. In this tutorial, you'll learn to hide the shopping cart icon when it's empty, streamlining your website's design and enhancing the user experience. product-quantity-input, div. How can I now remove the "quantity" option? Aug 11, 2024 · Pro TipsOther Tips squarespace tuanphan August 11, 2024, 11:03pm 1 You can follow these to add an ID to Cart Page when Cart Page is Empty. Thank you! Oct 5, 2021 · I have Squarespace 7. 0 site and want to hide the Header and Footer on the Shopping Cart page. Follow this step-by-step guide to disable or hide the cart for a non-eCommerce setup. I am on squarespace 7. Jan 4, 2023 · Greetings all: Strangest thing with the cart display on my website. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Mar 13, 2025 · 0 11 July 28, 2024 (Squarespace) How to hide Cart when Cart is empty Other Tips squarespace 0 8 June 28, 2025 (Squarespace) Remove Cart Icon Other Tips squarespace 0 80 April 10, 2024 (Squarespace) How to hide Navigation menu on One Page Other Tips squarespace 1 14 March 11, 2025 (Squarespace) How to hide Social Icons on One Page Other Tips Sep 20, 2024 · (Squarespace) Hide Add to Cart/Quantity on Certain Products Other Tips squarespace 0 219 April 27, 2024 (Squarespace) Hide specific product item on Shop Page Other Tips squarespace 0 12 February 13, 2025 (Squarespace) How to hide Cart when Cart is empty Other Tips squarespace 0 8 June 28, 2025 How to hide Products from Shop Page Other Tips Jul 30, 2025 · . cart-added { display: none !important; } To apply it on specific products, you can create a tag with name: disappear then assign it to products Then use this code to Custom CSS. Apr 22, 2024 · I was wondering if there was a way to make the cart pop out from the side, a floating cart. The template is Vance. You can use this code to Custom CSS. Click anywhere outside the editor to continue editing your site header. tag-disappear div. If you'd prefer to buy a popular tested solution May 19, 2020 · Hi there! I've just created a website using version 7. nested-category-breadcrumb-list-item:has(. 1 for your online store, you might have noticed that the cart icon doesn’t always appear until a product is added. However, the "cart" option is still floating at the top of my navigation, unconnected t Mar 10, 2023 · This website is not intended to sell anything, only gather leads, but we are setting it up with an ecommerce backend as we may be transitioning to online sales in the near future. product-detail . This video solves the frustrating technical roadblock experienced by small business owners using Squarespace and Meta Shops. Aug 5, 2023 · I enter my site as a visitor and it shows (9) items in cart and when I open the cart even though it's empty. Click Save to save your changes and keep editing, or Exit then Save to close the editor. p. If you wanted to add a continue button to the Cart page instead (the page that loads before the checkout), you could do this by writing some custom code and adding it to the site-wide code injection panel. Here's a step-by-step guide on how to hide a Squarespace section using custom code: Identify the section: Determine the specific section you want to hide. The products with hid Sep 30, 2023 · How do I change from 'Shopping Cart' to 'Creative Bag' using code please, my content is mainly free and the word shopping is not appropriate for this service Feb 24, 2025 · I need to hide price, add to cart button and quantity off some products. mov Unavailable Edited August 19, 2023 by ccxwood 8 months later Learn how to remove the shopping cart from your Squarespace website. I advocate for both, on behalf of everyone. 1 Hide Add to Cart buttons & Qty selector Tip by Paul @ SF. Sep 24, 2025 · Hi guys,A while ago, I implemented a code block to customize my shop page, and it was working perfectly. We're now building one for our land properties. I tried using a custom css code but it doesn’t seem like it did anythin Nov 30, 2023 · Looking to spruce up your Squarespace E-Commerce Store? In this guide, I delve into five popular codes related to the E-Commerce side of Squarespace. As Id love to keep some product shoppable. Keep your website looking clean!---This Dec 18, 2019 · Unfortunately the code to hide the 'Add to Cart' Button does not work anymore with the latest squarespace updates. 1 Thank-you, Dianna Mar 24, 2021 · We're currently building a new website for our business, and we've grown fond of Squarespace due to using it for our Coworking space. Customize buttons, fonts, and layout for a polished, professional cart design. Aug 29, 2024 · Hello excellent humans, Can anyone please tell me how to fix the following issues? Empty shopping cart page: 1. Aug 26, 2025 · Learn how to hide, remove, or disable the Add to Cart button on WooCommerce store product pages by adding small code snippets in the functions. I am hoping to remove the add to cart button in one of my shops, and instead replace it with an inquire button that generates a pop-form. 🙂 1mo Learn how to hide the shopping cart when empty and add a hidden shopping cart to your Squarespace site https://lnkd. ProductItem-quantity-add-to-cart { display: none!important; } You can hide prices of all products by adding this to the Custom CSS panel: /* Squarespace 7. It runs all the way down to the footer, and it happens on every page. I do need to keep the button and price in our actual store, so want to find the new code to achieve this. I had previously started to set up my site for commerce for selling some digital products that I ended up not going through with and have removed from my site, no live options to buy. Feb 11, 2025 · Learn how to create a hidden shopping cart on Squarespace with our simple CSS hack—remove the empty cart icon and link directly to your checkout. Squarespace Recording Cart Quantity. . It has been updated to work on Squarespace 7. cart-quantity-zero { display: none; } Learn how to hide the shopping cart when empty and add a hidden shopping cart to your Squarespace site! 🔗 Original post:https://ajmexperience. Here's how to remove the header from any (or every) page on your Squarespace site with just a little custom CSS. /* hide add to cart */ . To prevent this, hide the individual products too. kerryphippenart. Want to improve your Squarespace store? I build proven solutions at SF. At the moment, clicking the cart icon simply redirects to the cart page, rather than displaying a lightbox sort of thing. Mar 9, 2023 · Hello! I have some code in my site to change any products that have 0. Does a CSS required now ? this is a standard feature for all ecommerce . 1. Jul 3, 2025 · I'm in the process of updating a client site to Product V2. Is there a CSS code for this? Jan 2, 2025 · Disabling a store page prevents customers from purchasing products, but if a customer already has a product in their shopping cart before you disable the page, they can still purchase it. category-item:has(. And mainly use this as a catalog site for now. I've duplicated the site so I can see what needs to be updated. I did have a site wide code to remove the square space add to cart, but I have multiple stores selling different items some of which would be better with the square space model not a buy button. I created a store in 7. I've attached a screen recording showing cleared cookies, history and the issue present. I can't seem to figure out how to change it, and I'd hate for people visiting my websit Our Cart UX Extension for Squarespace can improve your customers' experience and boost sales. 1 to hide the shopping cart icon in the header when there's nothing in the cart? I've tried a few things suggested here in the forums and on the web but they all seem to only work with Squarespace 7. Help transition curious visitors to loyal customers by guiding them towards the cart and checkout. Jul 28, 2023 · I would like to change the message of the shopping cart section; instead of 'You have nothing in your shopping cart' for it to say 'Your bag is empty' . However, I've just noticed that the "Add to Cart" button has reappeared on the shop page, even though the code I used is still the same. Communication should be honest. Jan 11, 2024 · Hi Everyone, I am wanting to hide the price of some of my product and mark them as POA or POR. However, with the latest Fluid Engine upd Search for jobs related to Squarespace hide cart when empty or hire on the world's largest freelancing marketplace with 24m+ jobs. com/learn-post Here’s a simple code snippet to allow you to hide the shopping cart icon when the cart is empty. Please suggest how to do that? Thanks a lot. This removes the products from their cart. I don’t want people purchasing through the Cart but I would like the convenience of being able to add and remove items through the product page. Aug 16, 2020 · Hi, Wondering can somebody help me. Change Sho Do you ever wish you could hide the cart icon on your Squarespace Website while the cart is empty? In this video I show you how to only show the cart icon once an Jun 25, 2024 · Hello, I want to add a second button to the empty shopping cart so both of them lead to different shops on the site. Feb 28, 2025 · Other Tips squarespace 0 8 August 18, 2024 Add ID to Cart Page when Cart Page is Empty Other Tips squarespace 0 5 August 11, 2024 (Squarespace) Hide specific product item on Shop Page Other Tips squarespace 0 16 February 13, 2025 (Squarespace) Add text "See store for pricing" under product name on product page Other Tips squarespace 0 14 Jan 25, 2025 · To hide Product Price on Cart Page, you can do these. product-add-to-cart { display: none!important; } If you want to hide the Add to Cart button because you want users to contact you to enquire about the product, I encourage you to take a look at my Product Enquiry Form May 10, 2021 · No I haven't yet the item is just marked as sold out, I need code to hide the squarespace add to cart and etc on individual items, not a site wide code that applies to all items. Apr 21, 2025 · Learn how to style or hide your store's shopping cart icon and display the number of items in it. In this video on How to Remove Cart Icon in Squarespace, we'll be showing you how to remove the cart icon from square Apr 27, 2024 · To hide Add to Cart button and Quantity on Certain Products, you can follow these steps. Do you ever wish you could hide the cart icon on your Squarespace Website while the cart is empty? In this video I show you how to only show the cart icon once an Mar 3, 2025 · Learn how to edit checkout settings and style your checkout and shopping cart pages for a seamless shopping experience on Squarespace. The 0. Specific Product First, you need to find Product Item URL. The problem stems from Squarespac Oct 9, 2022 · I have a summary block showing future events. Jan 25, 2023 · ⭐ Community Leader ⭐ SQSP Expert ⭐ Software Engineer ⭐ UX Designer ⭐ Design should be simple. DIGITAL */ . Mar 8, 2023 · /* Squarespace 7. However, with the latest Fluid Engine up this has Oct 28, 2019 · Squarespace Webinars Free online sessions where you’ll learn the basics and refine your Squarespace skills. QUESTION: Is there a way for us to auto-hide (not remove, but HIDE) categories that don't have products in it? The May 23, 2025 · To add or hide a button, social icons, shopping cart icon, a customer accounts login, or a language option, click Add elements, then switch the toggles off or on. Does anyone know how to resolve this issue and remove th Aug 26, 2025 · Learn how to remove price from product on Squarespace easily using built-in settings or simple CSS hacks to hide prices on your store and product pages. thank you Edited May Dec 18, 2019 · Hey I am trying to remove or disable the Add to Cart button on my product pages. My shopping cart shows that there's an item in it even though I don't currently have any products listed. com I don't want put price on my products or finalize the sale on the page, but I want keep the products and descriptions. The prices are set on the product but they are hidden using css, the problem I'm having is when you google some of the products individually, it's showing If you're creating landing pages or sales pages, chances are you'll want to remove the header from a page on Squarespace. Jul 14, 2020 · I wanted to see if there is a way to make the cart icon quantity label not display zero when there is nothing in the cart and only display numbers (1+) when there are items in the cart. Jan 8, 2021 · Can someone pls help me remove this empty whitespace between my products' "Add to cart" button and the "Additional Info" section? Keep in mind this empty space only appears on desktop and not on smaller screen sizes. Aug 13, 2021 · Hello, can anyone help me with a code to hide the shopping cart icon when not in use. Discover a simple JavaScript solution to easily hide empty page sections in Squarespace that contain summary blocks. I've tried to remove all custom CSS to see if that helps, and it doesn't change Jul 11, 2020 · How can I hide the quantity column on the shopping cart page? I've found a code to hide it on the actual product page, but it still shows up in the cart. xkth dts sich uejxvo ijdmx hzez fdsy hnazz fug tfsnzg eqtxe ecg svhdmtr jjqa nbfnwix