Troubleshooting Your First Popup

You created your first Popup Maker popup. Then, you bring up an incognito or private browser window and go to your site to test it out. But the popup doesn't show. What gives?

This guide covers the most common reasons why your popup doesn't show and why it might not close along with ways to troubleshoot them. 

Problems With Showing Your Popup #

The common reasons your first popup isn't showing are:

  1. The popup isn't published or turned on (enabled). #
  2. The popup doesn't have a trigger. #
  3. There's a popup targeting condition that's blocking it. #
  4. There's a CSS conflict that could also "freeze" your page. #
  5. Your browser, WordPress, server, or CDN caches need clearing. #
  6. There's a JavaScript error showing in the browser console. #
  7. Another plugin or your theme has a code conflict (e.g., JavaScript error) with Popup Maker. #

Make sure your popup is published. When you edit your popup, check the Publish status and Popup Enabled toggle. The status should say Published, and the Popup Enabled toggle button should be on the right side with a green background color. Here's what those look like.

Besides having your popup turned on, the next must-have is a popup trigger. A popup trigger is what actually launches your popup. 

For example, the 2 most common triggers are the Auto Open trigger and the Click Open trigger. If you want your popup to display automatically, be sure you've got an Auto Open trigger for the popup. If you want your popup to display when someone clicks a link or button, make sure your popup has a Click Open trigger.

Visit our Add a Popup Trigger help guide to learn how to add a popup trigger to your popup.

To get a full list of available triggers, head over to our Complete List of Popup Triggers doc.

You checked that your popup is turned on and you've got the right popup trigger set up. All that looks good. But your popup still doesn't display.

You might have a targeting rule (or condition) that you forgot about or didn't set up correctly. 

Let's back up and review what we mean by targeting. Or, TL;DR: follow this step-by-step guide to check your popup's targeting conditions.

Remember when we learned earlier that triggers launch popups? Well, you use targeting to selectively load your popup to display on a specific web page. For example, you can target your popup to show only on the homepage, only for posts, and much more.

Now, let's look at a couple of examples of Targeting Conditions gone wrong:

Mistake 1) You only need a popup to appear on your About page when someone clicks on a Learn More link on that page. 

Here's the mistake. Your Click Open popup has a targeting rule for loading only on the Home Page instead of the About page. That means your popup won't show when you click on the Learn More link on your About page. 

The interesting thing is that your popup will load on your Home Page because of the targeting rule. But it won't appear there either because you don't have a click trigger set up on the Home Page to launch the popup.

Solution: Change your targeting condition to target the About page. Below, we changed our condition from Home Page to Pages: Selected > About. The popup can now display on the About page.

Mistake 2) You want your popup to display automatically only on posts and pages.

Here's the mistake. You have a targeting condition to load the popup only if you're viewing a post  AND a page. Since a post isn't a page (and vice versa) and you can't view a post and a page at the same time (and in the same tab), you'll never see your popup.

Solution: Change your AND condition to an OR condition. Below, we changed our condition from All Posts AND All Pages to All Posts OR All Pages. The popup can now display if you're on a post or a page.

Pro tip: If a popup doesn't have any targeting rules, Popup Maker (by default) loads the popup on every post/page on your site, whether you need it or not (most common usage). So, targeting rules allow you to selectively load a popup only where you need it. This is an awesome feature, especially for site owners worried about performance.

Here is the step-by-step guide for checking your popup's targeting conditions.

If your popup doesn't show and your page "freezes," meaning that you can't scroll, there might be a CSS conflict on that page. Please try the CSS fix in our troubleshooting guide for this peculiar issue.

You might have done everything right. You saved all of your changes and published your popup. But you get nothing!

In this case, it could be your caches (yes, there is more than one cache to check). Don't fret. This is a super common problem. In fact, WordPress has a spectacular cache troubleshooting guide (probably the best one out there) just for this.

Clues you need to clear your caches

It's most likely a cache problem when your popup displays if you:

  • Use an incognito or private browser window: Try clearing your browser cache in the window that's not displaying the popup.
  • Are logged into your wp-admin area: Server-side caching apps (hosting or WordPress cache plugins) usually don't cache pages when you're logged in as an admin. If your plugin shows up when you're logged in, but doesn't when you're logged out, try clearing your hosting and WordPress cache plugins. 
More on caching

Caches save a copy of a web page so that WordPress doesn't always have to build the page every time you want to view it. Caches can make your WordPress site faster, but they can drive you crazy when you make changes and want to see those changes right away.

A cached (saved) copy of your page can be in your browser, a cache plugin, your hosting's cache, a database cache, and even a CDN cache. Be sure either turn off all your caching or continuously clear all of your caches while you're creating and updating your popups.

Here's what a JavaScript error looks like.

When you try to display your popup, check your browser console to see if there are JavaScript errors. If you see a JavaScript error, make sure you take a screen capture of it or copy/paste it somewhere. Share the error with your web developer or our support team.

You can also follow the instructions in our next section to help narrow down the JavaScript error even more.

WordPress has thousands of plugins and themes. A JavaScript error is bound to happen. The good news is that there are tons of help guides and support channels to help you troubleshoot JavaScript errors.

Speaking of plugins and themes, they can interfere or conflict with Popup Maker's code. 

Plugin Conflicts

Turning off all plugins except Popup Maker, removing any custom code, and switching to the Twenty Twenty-One theme is a de facto standard for troubleshooting WordPress code conflicts. 

If the problem goes away when you turn off all plugins except for Popup Maker, then you'll know it's a plugin conflict. To figure out which plugin is the culprit, you can turn on each plugin 1-by-1 until you see the issue again. The last plugin you switched on before seeing the error is usually the one that's interfering with Popup Maker. You can find another plugin or contact the plugin author for a workaround.

Clip of turning off all plugins except Popup Maker

Video clip of turning off all plugins except Popup Maker

Theme Conflicts

If the problem is still happening after all plugins except Popup Maker are off, then switch your WordPress theme to a default like Twenty Twenty-One. If the error goes away after changing your theme, then your theme is probably creating some mischief with your popups. You can find a different theme or reach out to the theme developer for a workaround.

Video clip of switching to a default WordPress theme

For more instructions, follow WordPress's definitive Solve Problems With Plugins guide. If you need a minimalist step-by-step with best practices and screen captures, have a look at How to Troubleshoot a Plugin or Theme Conflict.

Pro tip 1: Make a copy of your live site (a.k.a., staging site) and test for conflicts on the staging site.

Pro tip 2: If you need to troubleshoot on your live site, do it during off-peak hours or use the Health Check & Troubleshooting plugin.

If you want your popup to display only once during a browser session, you'll need to set up a cookie for your popup. Setting up a cookie is like leaving a note to tell the browser, "Hey browser, the visitor already saw this popup, so don't show it again."

The first thing to do is make sure you allow your browser to create cookies. If your browser doesn't allow cookies, then your popup will keep showing even if you have a cookie set up. In other words, your browser will never get the memo saying the visitor already saw the popup.

Check all your cookie preferences in your browser settings and any privacy addons or apps you have on your computer.

The second thing is to ensure you have a cookie set up in your popup trigger. If you added a cookie to your popup trigger, you should see:

  1. A cookie name next to your trigger type
  2. A cookie listed in the cookies section of your triggers settings

If you see something like this (no cookie name and no cookie listed) instead.

The popup above has no cookie set up, so it will display every time you visit a page on your site.

Then, you need to add a cookie to your popup trigger. Here's how.

You can add a cookie to your popup trigger as part of creating the trigger or later when you're done with your trigger. If you've got your trigger but never set up a cookie for it, follow these steps.

1) Define when you want the browser to create your cookie

Go to Popup Settings > Triggers. Click Add New Cookie.

Select when you want to create the cookie (e.g., when someone closes or opens the popup). Click Add.

Name the cookie (e.g., pum-15). Type in how long you want the cookie to last. This tells the browser how long to wait before showing the popup again. The default is 1 month. Other examples are 30 minutes, 24 hours, and 7 days.

Click Update to save your cookie settings.

2) Connect the cookie to your popup trigger

Click on the pencil   icon to edit your trigger. For the Cookie Name, select the cookie you created in step1. Here's how that looks for an Auto Open trigger.

Click Update to save your trigger changes.

Your popup trigger should look something like this now.

The settings above tell the browser not to display a popup for 1 month after it's closed.

Remember to Publish or Update your popup to save all of your changes.

This almost always happens because of a recent change such as:

  • Upgrading WordPress
  • Upgrading PHP
  • Adding a plugin
  • Deactivating a plugin
  • Updating plugins
  • Adding custom code (CSS, JavaScript, or PHP)

If you just upgraded something, try downgrading it to the previous version. If you added something, try removing it. If you updated a bunch of plugins, try following the instructions we covered for:

Go to your  Popup Settings > Targeting tab. Make sure these 2 checkboxes are not checked (unchecked).

  • Disable this popup on mobile devices.
  • Disable this popup on tablet devices.

See the screen capture below for a visual.

Be sure to Publish or Update your popup to save any changes. Your popup should now display on mobile devices.

If not, you might have a plugin or theme conflict. Try following the instructions we covered for troubleshooting a plugin conflict.

Go to your  Popup Settings > Targeting tab. Make sure you check these 2 checkboxes.

  • Disable this popup on mobile devices.
  • Disable this popup on tablet devices.

See the screen capture below for how to disable your popup on mobile devices.

Make sure to  Publish or Update your popup to save any changes. Your popup should not display on mobile devices anymore.

If it still shows on mobile devices, you might have a plugin or theme conflict. Try following the instructions we covered for troubleshooting a plugin conflict.

This happens when there's a CSS or code conflict with another plugin or theme. Head over to the troubleshooting a plugin conflict section.

If it's not a plugin or theme conflict, reach out to us so we can take a closer look.

If you haven't, add the Popup Maker CSS classes popmake-close and pum-close to your button tag. These classes tell Popup Maker to close the popup when you click your custom close button. 

Here's a code example.

<button class="popmake-close pum-close">My Close Button</button>

If you used the Popup Maker Shortcode Button, try deleting the Popup Close Button shortcode and adding a new one. See the video clip below.

When you're done editing your custom HTML button or re-adding your shortcode, click Publish or Update to save your changes.

If your close button still doesn't work, reach out to us so we can take a closer look.

Pro Tip: If you want your close button to close the popup and open up another page too, check out our Close a Popup When a Link Inside the Popup Is Clicked guide.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.