Embedding a Shopify Buy Button to Your Landing Page


This article will explain how to embed your custom Shopify Buy Button directly into Unbounce, using the HTML widget. 

Did you want to create a Shopify button in Unbounce with a customized Shopify link (instead of an embed code)? Check out our detailed help guide here: Adding a Customized Shopify Button in Unbounce. 

Embedding A Shopify Buy Button to Your Landing Page

  1. Create a Shopify Buy Button (check out Shopify's Adding a Buy Button or embedded collection to your website guide for instructions on creating your button and how to retrieve your HTML embed code).
  2. Copy the embed code from Shopify for your buy button.
  3. Head back into Unbounce and navigate to the page you would like to this Shopify button. Open this page in the Unbounce Builder. 
  4. Drag the Custom HTML widget in the Page Builder onto the screen where you want your Shopify Buy Button to display.
  5. Paste your code into the HTML field and click Done.
  6. Save and Publish your landing page to finalize these changes.
  7. If necessary, adjust the size of the custom HTML element to ensure the entire button is visible.

Custom HTML is only visible within Preview mode or the published page (not within the builder). 

Do you agree or disagree with this statement: This article helped me find the information I needed quickly and easily.

Select an option and leave us some feedback in the comments:

Strongly DisagreeDisagreeSomewhat DisagreeUndecidedSomewhat AgreeAgreeStrongly Agree

Measuring Customer Effort Score with Nicereply