System updates

We’re experiencing issues that may affect your Square services. We’ll continue to update our status page with more information.

Back to Home

Add a Square Online Checkout Buy Button to Your Website

As you're getting started with Square Online Checkout links, you can also create a buy button and add it to your website as a convenient way to take customers directly to a checkout page. Create your buy button by generating a small piece of HTML code that you can embed on your website, blog, landing page or even the body of an email.

Note: If you need help with adding embeddable HTML code to your website built outside of Square, contact your website provider or publishing platform directly for support. You can also visit their support centre to see if they have this information readily available to you. While we cannot guarantee that your third-party website will be able to support Square’s buy buttons, many website hosts should be able to support them.

Create a Buy Button

To create a Square Online Checkout buy button:

  1. In your online Square Dashboard, go to Online Checkout.

  2. Select Add button to website.

  3. Add a title, button text, amount and adjust the frequency of the payment.

  4. Add an optional image, and adjust the Advanced settings if needed.

  5. Click Continue to customise your buy button styles. These settings will be applied to all of your buy buttons.

  6. Select Copy to copy the HTML code, and paste it somewhere that accepts embeddable code.

Manage Settings for Buy Buttons

To manage settings for your buy buttons built with Square Online Checkout:

  1. In your online Square Dashboard, go to Online Checkout.

  2. Select Settings > Branding.

  3. Choose your button font, colour and shape.

  4. Toggle your button style settings like Image, Title and Price.

  5. Select Save when finished.

All future buy buttons you create with Square Online Checkout will default to these settings.

Add a Buy Button to WordPress

Need to embed a buy button on WordPress? Learn more in the WordPress.org support centre.

You can add a buy button to your WordPress.org site. To add a buy button to WordPress, check out how to embed on a WordPress website in WordPress.org's support centre.

Note: Embedded buy buttons are compatible with the WordPress.org platform, but not with WordPress.com.

Add a Buy Button to Squarespace

Need to embed a buy button on Squarespace? Learn more in the Squarespace support centre.

You can add embed code to individual posts in Squarespace and to the menus on your homepage. In some cases, you might want to do both. For example, you can embed a basket on your home page to receive purchases from buy buttons that you embed on individual posts. To add a buy button to Squarespace, check out how to add custom code on a Squarespace website in the Squarespace support centre.

Note: Some advanced customisations on Squarespace are theme-specific. These customisations aren’t supported by Square.

If you complete the steps and your buy button isn't loading, then you might need to disable Ajax loading. To see more details, see how to enable or disable Ajax in the Squarespace support centre.

Note: If you add an embedded basket to a menu on your Squarespace homepage, then it receives orders from buy buttons that you embed on individual posts.

Add a Buy Button to Wix

Need to embed a buy button on Wix? Learn more in the Wix support centre.

After you’ve created a buy button or collection in your Shopify admin, you can add it to your Wix website using the Wix Website Editor. To add a buy button to Wix, check out how to embed on a Wix site in the Wix support centre.

Note: If you want to embed buy buttons for multiple items, then you need to edit the embed code before adding it to the Wix HTML code widget. If you embed more than one buy button on your Wix website without editing the embed code, then customers trying to buy more than one product will see a separate basket for each product.

If you want to display more than one product on your Wix website without editing the embed code, then you can embed a collection. You can create a new collection in your Shopify admin for the products that you want to display on Wix.

Note: When you create your buy button for a Wix website, you cannot use the "Redirect in the same tab" option due to Wix limitations.