Sticky bars and popups are a great way to inform your visitors of current campaigns, upcoming promotions, gather email addresses, newsletter sign-ups, and more!
If you've built your landing page using the Classic Builder, you can install and embed your popup or sticky bar directly in the builder.
This article will explain how to install an Unbounce popup or sticky bar onto your Classic Builder page, which includes the following steps:
- Creating your Popup/Sticky Bar in Unbounce,
- Copying your Popup/Sticky Bar Embed Code, and
- Installing the Popup/Sticky Bar App in the Classic Builder.
Do note that you can only add one embed code from each client to a page at a time. If you attempt to add more than one embed code to a page, only the first one to load will fire.
Building with Smart Builder? See Installing Popups and Sticky Bars into Smart Builder to learn more.
Creating your Popup/Sticky Bar in Unbounce
To start, build and customize your popup or sticky bar in the Unbounce Conversion Intelligence™ Platform.
Design your popup or sticky bar to your liking, adjust the trigger and frequency settings, and link to any custom integrations.
For more information, see these articles:
Creating a Popup in the Unbounce
Creating a Sticky Bar in the Unbounce
Copying your Popup/Sticky Bar Embed Code
- Navigate to the Overview page of your popup or sticky bar.
- Scroll down the page to the Installation panel.
- Click the Copy button to copy the embed code:
- Publish the popup or sticky bar at the top right-hand corner of the Overview:
You've now published your popup/sticky bar! Keep that embed code on hand, as you will need to paste it into the Classic Builder.
Installing your Popup or Sticky Bar into the Classic Builder
- Navigate to the Classic Builder for the landing page where you'd like your popup or sticky bar to appear.
- Click the Javascripts
button at the bottom left\corner of the screen. A new dialog box will appear.
- In the new Manage Scripts dialog box, click the green Add Script to this Variant button.
- Update the following:
- Fill in the Script Name field with the name of your popup or sticky bar.
- Select Head from the Placement drop-down menu.
- Paste the embed code of the popup or sticky bar script in the text box. Ensure to include the <script> tags in the field:
- Click the Save Code button in the bottom right corner of the dialog box to finalize the script.
Be sure to Save & Republish the landing page.
You're all set! The popup or sticky bar will appear on your Unbounce landing page.
Having trouble viewing your Popup or Sticky Bar?
If you're having trouble viewing your popup or sticky bar on the live page, it could be that your browser is caching the previous version of your landing page before the most recent republish.
Clear your browser cache and history, or open up the landing page on an incognito window to view the most up-to-date version.
See this article for some helpful tips on how to view the most up-to-date version of your landing page: Why Do I See the Previous Version of My Landing Page After Republishing?
