Direct Customer To Cart After Adding Product

Hi All,

Currently when a customer goes to my site and adds a product it marks the product as added and indicates that the cart has (x) number of items in it. No further action is taken. This is manageable on a computer, but it's a problem on the mobile view. The cart icon isn't shown on the mobile view; you have to click the menu button to expand it. As a user it's not the most intuitive experience. 

I would like to either a) direct the customer to the cart after adding a product and provide them with "Continue Shopping" option (continue shopping currently only shows if the cart is empty), or b) provide a pop up or additional buttons that allow the customer to choose to go to the cart or continue shopping.

To this point I have been able to add a "Checkout" button to the product page, but due to the Ajax loading features - which I can't turn off using my template - the button doesn't show unless the user refreshes the page. 

Product page for reference: https://www.fantasiummedia.com/shop/fantasium-2020-calendar

Any help is appreciated and will be thanked with a major discount on any orders!

I've written a blog post about adding a pop-up that appears when a user adds an item to their cart (linked below). I haven't tested it on the specific template that you are using but its worth trying.

https://thompsonweb.design/squarespace-website-tips/added-to-cart-pop-up

@ThompsonWebDesign thanks so much for sending this over. I input everything into the CSS / Code Injection editors, but no luck. Is it most likely because it's not compatible with my template? 

Hi @fantasiummedia,

So I've played around a bit and made some adjustments with the code that goes in the footer and I can get it to semi-work on the template that you are using. Just from what I can see it looks like you're using a template from the York family, is that correct?

If so I can get it to work without AJAX enabled. For whatever reason the pop-up I've created works with AJAX enabled on the Brine family of templates but not the York...

Anyway if you are using a template from the York family then you can Disable Ajax. Just go to the Design -> Site Styles and within the first block, last item you will see a checkbox for AJAX.

@ThompsonWebDesign that's correct - I was able to figure out how to disable Ajax loading, it was hiding from me before. Are there additional adjustments I need to make in my code to get it functioning on my site?

Hi @fantasiummedia, I’ve updated my blog post so it should now work on your website. You will just need to replace the code that goes in the code injector footer. 

@ThompsonWebDesign This is fantastic, I happened to be looking for this today and stumbled across your post.

I was able to implement on Squarespace 7.1, but the pop-up only displays one time. If I click the exit button or Continue Shopping and add more of the same product to the cart (perhaps a different variant), the pop-up no longer displays. Is there any way to add to the code so that the pop-up appears every time Add to Cart is clicked?

I'm sure this must be a simple fix, but not particularly tech-savvy. Appreciate any insight you can provide!

Hi @NiceToMeetYou, this is intended behaviour; it will only display once per page load. This is because otherwise it had a tendency to keep on popping up even when dismissed on AJAX enabled websites.

@ThompsonWebDesign thank you so much, that was a perfect fix for my site. Check your inbox for a sweet discount code!