Buy me a coffee

Adding Product Block to Cart Page

Description: 2 options to add a Product Block to Cart Page

Support: Free install, just send me an email with your site url + detail request, I will take a look. If it’s not complicated, I can install it for you.

Option 1. Adding Product Block to Footer then use code to move to Cart Page

First, add a Product Block in Site Footer

product-block1-min

product-block2-min

Next, add this code to Code Injection > Footer 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('footer.sections .product-block').insertAfter('div.cart-container');
});
</script>
<style>
div#sqs-cart-root .product-block {
    max-width: 300px;
}
</style>

product-block3-min

Result

product-block4-min

Option 2. Adding Product Block to Not Linked Page then use Plugin

First, Adding a Not Linked Page > Add a product block there

  • Page Name: Product Block
  • Page URL: /product-block

product-block5-min

Next Install Section Loader Plugin (referral link)

Next, add this code to Design > Custom CSS

body:not(#cart) div.wm-load-container {
 	display: none !important;
 }

product-block6-min

Next, add this code to Settings > Advanced > Code Injection > Footer (or Settings > Developer Tools > Code Injection > Footer)

<div data-wm-plugin="load" data-target="/product-block"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
  setTimeout( function() {
          $('div.wm-load-container').insertAfter('div.cart-container');
    }, 3000);
});
</script>

product-block7-min

Result

product-block8-min

 

Ask me a question, free

If your site is private or in trial, just setup password and share url. See how to: https://beaverhero.com/squarespace-how-to/
Please check your email carefully. Recently I got a lot of questions with wrong emails.

If you haven't heard from me within 24 hours please check your junk/spam folder