1. Documentation
  2. Working with Popups & Sticky Bars
  3. Installing a Popup or Sticky Bar

Installing your Popup/Sticky Bar in WordPress

Follow
Avatar
Leslee Teehankee
Last Updated

This article describes how to install your Unbounce Popup or Sticky Bar on your WordPress blog posts or single pages, and across all pages connected to a domain. 

These steps will work for both Wordpress blog posts and general Wordpress pages.

Installing your Popup/Sticky Bar on a Single WordPress Page or Post

  1. In the Unbounce builder, navigate to the Popup/Sticky bar page that you’d like to install. Scroll down the page to the Installation panel. Click the Copy button to copy the embed code.
  2. Log in to your Wordpress account. From the Dashboard, select Posts from the left side menu. A new screen will appear.
  3. Click on the blog post title where you’d like your Popup or Sticky Bar to appear.
  4. Click on the Text tab to switch your edit view to code.
  5. Paste the embed code for your popup/sticky bar at the top of your post, before the post's content begins.
  6. Confirm that the URL on your WordPress account matches the URL target set up for your Popup or Sticky Bar in Unbounce. These two URLs should match exactly:
  • Your permalink field in your WordPress post.
  • Your URL Targeting field in your Unbounce popup/sticky bar overview page.
  • Click the Update button on the right-hand side of the screen to update your post and publish your changes.
  • You're done! Feel free to test out your Popup or Sticky Bar live.

    • Note:

    Only one embed code from each client can be added to a page at a time. If more than one embed code is added to a page, only the first one to load will fire.

    Installing your Popup/Sticky Bar Across your WordPress domain

    To install the Unbounce embed code, you will need Administrator-level user role permissions for your Wordpress site.

    In your Unbounce Account: 

    1. In the Unbounce app, navigate to the Popup/Sticky bar page that you’d like to install.
    2. Scroll down the page to the Installation panel.
    3. Click the Copy button to copy the embed code.

    In your Wordpress Account: 

    1. Log on to your Wordpress Admin and click on Appearance on the left side menu.
    2. Select Editor from the drop-down menu.
    3. Scroll down the Theme Files menu on the right-hand side of the screen. Select Theme Header (header.php).
    4. Paste your Popup/Sticky Bar embed code within the script, anywhere between the <head> and </head> tags.
    5. Click the blue Update File button at the bottom left-hand corner of the screen to save your changes.

    You’re done! Navigate to your WordPress domain to check out your new live Popup/Sticky Bar.

    If you plan to update the header.php file in the future, you may overwrite the Popup/Sticky Bar embed code. Always double-check the presence of your embed code after making changes to the header.php file. 

    Note:

    Only one embed code from each client can be added to a page at a time. If more than one embed code is added to a page, only the first one to load will fire.

    Related articles