Installing your Popup/Sticky Bar in Shopify

Follow

This article describes how to install an Unbounce popup or sticky bar onto your Shopify page, in your Shopify account.

Do note that you can only add one embed code (from each Client) to a page at a time. If you include more than one embed code, only the first one to load will fire.

Copying your Popup/Sticky Bar Embed Code from Unbounce

  1. In the Unbounce Conversion Intelligence™ Platform, navigate to the Overview of the popup or sticky bar that you’d like to install into Shopify.
  2. Publish your popup or sticky bar. 
  3. Scroll down the page to the Installation panel. Click the Copy button to copy the embed code:
    Annoated image of red arrow pointing to 'Copy'.

Installing your Popup/Sticky Bar in Shopify

Next, log in to your Shopify account.

  1. From the Dashboard, select Online Store from the menu on the left-hand side of the screen. A new page will appear.
  2. Select Themes from the Online Store menu on the left-hand side of the screen.
  3. Click the Actions button on the right-hand side of the screen. A new drop-down menu will appear.
  4. Select Edit Code from the drop-down menu. A new screen will appear:
    Annotated image of steps from 5 to 6 navigating to Shopify theme edit options.
  5. From the Layout menu on the left-hand side, select theme.liquid. Your code will appear on the right-hand side of the screen:
  6. Paste your line of Popup or Sticky Bar script into your post, anywhere either between the <head> and </head> tags or between the <body> and </body> tags.

    Here's an example with the popup/sticky bar embed code placed after the opening <head> tag:
    Popup/sticky bar embed code placed after opening head tag in Shopify source code
  7. Click the Save button at the top right-hand corner of the screen to publish your changes.

Your popup/sticky bar should now be installed on your Shopify page!

To test your popup or sticky bar, click the Online Store button on the left side menu to view your store.