Creating a Custom Checkout Button on Squarespace
Ever want to use your shop and product section, but link it to an external checkout button or website?
Here are some examples:
You want to list your Teachable classes as products on your website, but you want to link them to your Teachable checkout button.
You’re a fitness studio and want to sell gift cards along with products, but you want your gift card linked to your fitness studio software.
You want to sell an in-person service along with your physical products, but you want your checkout button to go to your appointment site.
These are just a few examples of how this tutorial can be used to create a custom checkout button on a specific product.
Tutorial
In your product description (where you’d like to add the button) add a text link. The text will be what you want the button to say. The link will be where you want it to go. For example Purchase Gift Card.
At the top, go to Additional Info in your Product Settings. Here, you’ll add a Code Block. Add the following code:
Squarespace 7.1
Squarespace 7.0
This is for a black button, with white text and rounded corners. You can style the button however you’d like in the code.
The code also hides the price and variants. You can remove these lines of code to keep them. Line 1 is the price. Line 2 is the variant.
Video Tutorial
Let me know in the comments if you have any further questions! Thanks!