The OTHER elusive answer to Continue Shopping WITH items in cart

Hi All,

Thought we'd give back to the community :)

Using this method, we were able to add a basic 'Continue Shopping' button on the Pacific theme, it might work for other themes. Its not ideal as it adds a bit of code to all pages, but it does seem to work. We hope Squarespace can soon negate the need for something like this.

1. To start with, we browsed to our /cart page and using the 'view source' option of the browser, we were able to determine that the DIV ID of the Shopping Cart DIV container was: sqs-cart-container

2. We then created the following script which looks for the above DIV ID and adds a 'Continue Shopping' button just before it - The button just takes the user to the last page:

   <script>
    var d1 = document.getElementById('sqs-cart-container');
    function goBack() {
    window.history.back();
   }
    d1.insertAdjacentHTML('beforebegin', '<p><button onclick="goBack()" align="right">← Continue Shopping</button></p>');
   </script>
   

3. This was added as a Code Injection (settings > advanced > code-injection) under Footer

Notes:

• It doesn't seem to have had a noticeable impact on performance

• Instead of a button, you can add atext link by changing the codeslightly as follows:

  <script>
   var d1 = document.getElementById('sqs-cart-container');
   d1.insertAdjacentHTML('beforebegin', '<p><a href="LINK">Continue Shopping</a></p>');
  </script>
  

• You can also change the position of the button by changing the 'beforebegin' variable. More information here

• It is also possible to change the formatting of the button or the link using custom CSS. Refer to Squarespace's own guide on Custom CSS or just Google it!

Regards and Good Luck :)

Web Development Team at ByteSize

Answer is provided in the question! :D

This is so incredibly helpful! Thank you for sharing so kindly!I have one hangup:I want this button to redirect to my products page, rather than using browser history, in case someone jumps to the shopping cart after looking at a different page. I have no expertise in coding and just google around for solutions, so forgive my question if it is naive....

I am guessing that I will need to change this part:

function goBack() {
      window.history.back();

to something else, but not sure how to phrase that. Do you have any knowhow about that? Thanks in advance!

Hi @npiep ,

You can use the below code instead and replace the word “LINK” with the URL to your products page:

   <script>
      var d1 = document.getElementById('sqs-cart-container');
      d1.insertAdjacentHTML('beforebegin', '<p><a href="LINK">Continue Shopping</a></p>');
    </script>

This is posted using a mobile device so please excuse any errors

Works perfectly, thank you for the response!!