Need help? You’ve come to the right place

What’s New Getting Started Building Integrating Publishing

Publish pop-ups to WordPress

Last Updated

While you can publish pop-ups to any webpage that accepts JavaScript and HTML, if you run your site through WordPress you can use our plugin to easily publish pop-ups.

 

The fine print

  • This only works with our standalone pop-ups—not pop-ups that are attached to a page. To learn more, check out Creating a pop-up.
  • Some pop-up publishing methods below require our Leadpages WordPress plugin. If you haven’t installed the plugin yet (or are using a version below 2.1) you can follow our installation instructions here.
  • For an overview of pop-ups (and the different types you can use), see How pop-ups work.

Button, text link, and image pop-ups

Copy+Paste method

All standalone pop-ups can be published via the HTML code produced in the Publishing Options of the pop-up, accessible either in the builder or from the Conversion Tools > Pop-Ups listing under the actions menu more. This method does not require our WordPress plugin. Learn more on where to find your pop-up code.

WordPress 5.0

WordPress 5.0 is WordPress' newest editor, which gives users the ability to edit their posts by using blocks to arrange content.

Once you've got your pop-up code, when editing your post or page (or creating a new one) in WordPress 5.0, add a Custom HTML block where you'd like the pop-up to show up on your page (if it's a timed popup or exit intent pop-up, it doesn't matter where you place the block on your page).

Once that block has been added to your WordPress page or post, paste your pop-up code into the HTML code block.

WordPress Classic Editor

WordPress Classic Editor is WordPress' legacy editor and will be supported by them until 2021. If you're running a version of WordPress prior to 5.0, you're likely using the Classic Editor.

Once you've got your pop-up code, while editing your post or page (or creating a new one) in WordPress, be sure to switch over to the Text editor, which will allow you to paste in HTML. Then, paste in the code for your pop-up where you want it to appear in your post, as shown below.

Adding pop-ups to WordPress widgets

In order to add a pop-up to a WordPress widget, you'll want to have your pop-up publishing code handy, either as a plain text link, button, or image pop-up. Learn more here on how to access that code here.

Step-by-step adding a pop-up to a widget

  1. Copy your entire pop-up publishing code, then navigate to Widgets under Appearance on the left-hand sidebar of your WordPress editor.
  2. Select a Text widget, then make sure you're in the Text tab of the widget editor.
  3. Paste the pop-up code and Save your widget.

Timed and exit pop-ups

Our plugin allows you to publish timed or exit pop-ups globally to your site—so all your pages can instantly call visitors to action. You can also publish timed and exit pop-ups to individual pages. Follow the steps below to learn how.

Configuring your publishing options

To publish a timed pop-up or an exit pop-up to WordPress, you’ll first need to configure and save those settings in Leadpages. Click Publish Options from your pop-up's action menu, then choose your desired options from the pop-up, as seen below.

NOTE: The publishing options you choose for your pop-up will apply to each page URL where you publish it. Therefore, if a timed pop-up is published globally to every page of your site, a pop-up that has launched on one page would not affect it launching on another.

Global timed and exit pop-ups

Here’s how you can publish timed/exit pop-ups globally to your WordPress site:

  1. Hover over Leadpages in your WordPress Dashboard’s sidebar, then click Pop-Ups.
  2. Select your pop-up from the timed, exit, or both sections. If you don’t see your pop-up, check to ensure you’ve set timed or exit options within Leadpages, then click the refresh button.
  3. Decide if you want your pop-up to appear on all pages, posts only, or pages only. Note that only one global timed or exit pop-up can be active at a time.
  4. Click Save to finish.
NOTE: To use a Drag & Drop pop-up, you’ll need to select the “Paste Drag & Drop Pop-Up” option, and paste in your pop-up's code as described in our article: Publishing your pop-ups

If you want a different pop-up to show up (or none at all) on a particular page, you can use the copy + paste method.

Other Standard (Legacy) Builder pop-up options

WARNING: The following pop-up publishing options are available for pop-ups built with the Leadpages Standard (Legacy) Builder. For newly created pop-ups, use the publishing options in this article above.

Page-specific pop-up widget

In addition to using the copy + paste method when publishing a timed or exit pop-up to your WordPress page, you can also use the pop-up widget on the right-hand side of the WordPress page editor when editing your page.

  1. Create (or edit) a page or post in WordPress.
  2. In the sidebar, select your pop-up from the Page Specific Pop-up panel.

When you publish or update your page, your timed/exit pop-up will be there. You can also use a global pop-up if you’ve set one up, or select “None” to prevent any timed/exit pop-ups from appearing on your page.

Pop-up shortcodes

NOTE: Only Standard pop-ups are available as shortcodes at this time and you must have the Leadpages WordPress plugin installed. To publish Drag & Drop pop-ups, you’ll need to copy and paste your code, as described here.

Here’s how to use pop-up shortcodes:

  1. Create a new page/post, or edit an existing one. 
  2. In the Visual editor, position your cursor wherever you’d like your pop-up, such as at the end of your post.
  3. Click the "Page Specific Pop-Up" drop-down menu icon and select your desired pop-up.

You’ll see some code appear in your post that looks something like this:

[leadpages_leadbox leadbox_id=00xx00x0000] [/leadpages_leadbox]

Repeat the steps above to add as many pop-ups as you’d like to your post.

Your pop-up will use whatever publishing settings are currently saved within Leadpages. To publish a button or image pop-up using our shortcodes, simply adjust your publishing settings within Leadpages and save them.

WARNING: When you make changes to your pop-up's publishing options within Leadpages, updates will automatically be reflected in WordPress when using the plugin. To publish different styles of the same pop-up (e.g. as a button on one page and text link on another) we recommend duplicating the pop-up and adjusting publishing styles independently.

Frequently asked questions

Why does my pop-up appear in a new window at a Leadpages URL on mobile?

Pop-ups on mobile automatically open in a new page in order to support the widest variety of mobile devices possible—so you don’t miss out on opt-ins from visitors using older devices.

Why doesn’t my timed or exit pop-up show up on mobile?

Exit and timed popups are disabled on mobile. One reason is to ensure your site’s SEO isn’t negatively affected by pop-ups—Google and other search engines may boost sites’ search rankings that avoid using timed popups on mobile. Also, most internet browsers block popups on mobile.

How can I add a timed or exit pop-up to a landing page?

Since landing pages aren’t quite the same as normal WordPress pages, the pop-up plugin does not interact with them. Instead, you can add your exit or timed pop-up HTML code to your page’s tracking code head section. See our guide here for instructions.


Need more help?

You can always get in touch with our support team—just click Support in your Leadpages navigation menu, or submit a ticket ↗

Was this article helpful?
Powered by Zendesk