Buy me a coffee

Add a button to all product pages

Description

  • Add a button next to Add to Cart
  • Click button >> Open an email form (autofill subject, item name,…)

#1. First, edit Additional Info (all products)

Add A Button To All Product Pages 1

#2. Add a Button Block

Add A Button To All Product Pages 2

#3. Enter button text + click Attach Link

Add A Button To All Product Pages 3

#4. Click Email, then enter your email, subject, body text. Since we will insert a Button Block for each product, you can change different subject and body text for each product.

Add A Button To All Product Pages 4

#5. Use this code to Code Injection Footer. The code will move Button Block from Additional Info next to Add to Cart.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('section.ProductItem-additional .button-block').appendTo('div.sqs-add-to-cart-button-wrapper');
});
</script>

Add A Button To All Product Pages 5 Min

Result

Add A Button To All Product Pages 6 Min

#6. If you want to make both same width, you can use this code to Custom CSS box.

div.sqs-add-to-cart-button-wrapper .button-block a {
    width: 100% !important;
}

Add A Button To All Product Pages 7 Min

Result

Add A Button To All Product Pages 8 Min