Pop Up!

Grab your visitors’ attention with pop ups to advertise your mailing list, special offer or ads.

Get Pop Up! »

or get all our 350+ premium plugins & themes »

Screenshots

Pop Up example
Pop Up menu
Pop Up settings
Pop Up settings 2
Create your popup
Set the display conditions
Pop Up Example

Video

Watch video
Detail

Grab your visitors’ attention with pop up! the most effective way to advertise your mailing list, special offer or ads on your WordPress site.

For such a simple and easy to use plugin, Pop Up! is packed with features

  • Display pop ups network wide, per site or on specific URLs.
  • Creating a pop up is as easy as adding a new post to your WordPress blog.
  • Customize the style and layout of your pop up to suit your existing site.
  • You control who sees your pop ups, including logged out users, visitors who have never commented and search engine visitors.
  • Set the amount of time that passes between when a visitor arrives at your site and a pop up displays.
  • You can allow visitors to hide a pop up forever.
  • Compatible with any WordPress theme.
  • Compatible with WordPress Multisite and BuddyPress.
  • Display your pop ups to visitors from specific geographic locations.

Style your pop ups to be as beautifully minimalistic or as graphically sophisticated as you like.

Pop Up

Once installed, getting started with Pop Up! is a snap. Just go to Pop Overs > Create New.

Creating a new Pop Up is as easy as adding a new post to your WordPress blog.

Creating a new Pop Up is as easy as adding a new post to your WordPress blog.

Name your Pop Up and add your content, whether it’s text, Javascript or an image for an ad.

You can add whatever kind of content you want to your Pop Up.

You can add whatever kind of content you want to your Pop Up.

You control the look of your Pop Up, from the positioning and borders to the background and font colors.

The built-in conditions give you total control over who sees your pop up. So if you only want visitors who are not logged, arrived at your site from Google and live in China to see your pop up, you can do just that.

Conditions allow you to choose who see your pop ups.

Conditions allow you to choose who see your pop ups.

 

Usage

For help with installing plugins please see our Plugin installation guide

Login to your admin panel for WordPress or Multisite and activate the plugin:

  • On regular WordPress installs – visit Plugins and Activate the plugin.
  • For WordPress Multisite installs – Activate it site-by-site (say if you wanted to make it a Pro Sites premium plugin), or visit Network Admin -> Plugins and Network Activate the plugin.

Getting Started

Once activated it adds a new Pop Over menu item to your dashboard.

popup-4530-menu

First thing, click on Pop overs > Settings to select your preferred loading method.

  • Page Footer – The pop over is included as part of the page html.
  • External Load – The pop over is loaded separately from the page, this is the best option if you are running a caching system.
  • Custom Load – The pop over is loaded separately from the page via a custom front end ajax call.

If you have difficulty getting your popup to display, try changing the loading method here.

Creating a Pop Over

Click on Pop overs > Create New to open up the Pop Over Editor.

popup-4530-create

Creating a new pop over can be as simple as giving your pop up a title and entering your content for the popup window. Or you could use your favorite graphics software to create an awesome image ad, and use that in your popover.

popup-4530-create-2

Now you just need to set conditions for when you want the popup to display by simply dragging and dropping which conditions you want to set for this particular pop up.

  • You’ve got lots of conditions to choose from, but choose wisely.
  • Try not to use too many or you may set a condition that cancels itself, causing the pop up to not display when you want it to.
  • When adding URLs to conditions, be sure to include the http:// part at the beginning, and a trailing slash (/) at the end.
Drag and drop Conditions to the Active Conditions area.

Drag and drop Conditions to the Active Conditions area.

Next you can tweak your appearance preferences for for your popup using the Appearance Settings panel below your conditions. Let’s take that in 2 parts.

1. Set Popover size, position & margins. 2. Or center with Javascript. 3. Select your preferred display style.

1. Set Popover size, position & margins.
2. Or center with Javascript.
3. Select your preferred display style.

1. The Pop Over Size, Position & Margins settings enable you to precisely size and position your popover on your site’s pages.

  • Check OR use Javascript to set my pop over size to automatically set the size according to the popover content.
  • Check OR use Javascript to position my pop over to automatically center the popover on screen.

2. Check or use Javascript to resize and center the popover to override the above settings, and automatically size & position the popover.

3. Set your Background Color & Font Color for your popover.

4. The Use Style setting allows to to choose how your popover should display on your pages.

  • Default will place it on your pages according to your position settings above, and it will scroll with the page.
  • Default Fixed will also place it according to your above settings, but the popover will stay put even when users scroll down the page.
  • Dark Background Fixed will position the popover according to your above settings, and keep it there when users scroll. It will also overlay a full-screen semi-transparent grayed out area over your page preventing any interaction with the page until the popover is closed.

Now let’s take a look at the 2nd part of the Appearance Settings section.

1. Remove "Never see this message again". 2. Make "Close" button permanent. 3. Set the expiry time. 4. Set the appearance delay.

1. Remove “Never see this message again”.
2. Make “Close” button permanent.
3. Set the expiry time.
4. Set the appearance delay.

For the first 2 settings here, it’s important to note that every popover has a “Never see this message again” link in the bottom-right corner which appears when the mouse pointer is hovered over the popover. If that link is clicked, the popover will not show again during that same visit to your site.

popup-4530-close

  • 1. Check Remove the “Never see this message again” link to disable that feature. This means that, even if your users close the popover, it will appear again every time the display conditions are met.
  • 2. Check Regular close button acts as “Never see this message again” link to remove the message, but give the functionality to the close button; the “X” in the top-right corner.

3. Set the Expiry time for your popover. This is handy if you are running time-sensitive promotions, and don’t want the popover to display anymore once the campaign is finished.

4. Show Pop Over allows you to show the popover immediately, or delay its appearance for up to 120 seconds.

Click Add and Activate to finish creating your pop over. Presto! You’re ready to use your new Pop Up!

Here’s our pop up in action!

popup-display

Editing a Pop Over

Editing a pop over is as simple as:

Click on Pop Overs > Pop Overs. Then hover your mouse over the title of the popover you want to edit to bring up the action menus.

popup-4530-edit

Now just click Edit to open your pop over in Edit mode and make the necessary changes.

Using Add-ons

This plugin contains several optional addons that you can enable to give the plugin more functionality .

popup-4530-addons

1. Activate the Anonymous loading method addon to enable an additional loading method you can then select under Pop Overs > Settings.

2. Activate the Use Local Geo Database addon if you are having difficulty with the default method (see below for instructions).

3. Activate the Advanced URL rules addon to add 2 new conditions you can use for your popovers. These new rules enable you to use regex to control the popover appearance.

4. Activate the Maximum width rule addon to add a new condition to display your popover only on devices with a viewport or screen greater than the width you specify. Very handy to prevent large popovers from displaying on small mobile screens.

5. Activate the Show on exit rule addon to add a new condition that makes your popover appear only when visitors scroll their mouse away from the page.

6. Activate the Show on click rule addon to add a new condition that makes your popover appear only when a visitor clicks an element on your site that you define.

7. Activate the Post Types rules addon to add 2 new conditions enabling you to fine-tune the post types where your popover should display or not.

8. Activate the XProfile Fields rule addon to add 2 new conditions that enable you to show or hide a popover according to BuddyPress X-Profile fields.

9. Activate the Test Head Footer addon to test for the existence and functionality of wp_head and wp_footer in your active theme.

  • These two functions are key elements in many plugins, including this one, and need to be in place for proper operation.
  • You can use this add on as a troubleshooter if your Pop Up is not displaying, or as a check before you even get started to ensure everything is in the correct place.

Using a Local Geo-Database

To enable the “Use Local Geo Database” addon (if you are having difficulty with the default method), you must first add the required table to your database.

Go to https://github.com/shrkey/countrylookupfromip and download the zip file by clicking the “Download Zip” button in the sidebar. Then unzip that file on your computer. Inside the folder, you will find a file called countrylookupip.sql.

popup-4530-country-addon

Import countrylookupip.sql to your database. In phpmyadmin, be sure you are in the root of your database. Click the “Import” tab, then the “Browse” button and browse to the countrylookupip.sql file you just unzipped. Leave all other settings as they are, and click the “Go” button at the bottom.

popup-database-import

Once the new table has been added to your database, you can enable the Use Local Geo Database add-on.

IMPORTANT: Always make a backup of your database before performing operations like this, just to be safe.

Network Wide

If you want to network activate this plugin and use it so popups are global then pop open your wp-config.php and add the following:

define(‘PO_GLOBAL’, true);

If you don’t define this contant but still network activate the plugin, then the control of popovers will be on a per site basis.

Other Constants

The url that we are using to return the country – it should only return the country code for the passed IP address:

define(‘PO_REMOTE_IP_URL’, ‘http://api.hostip.info/country.php?ip=%ip%’);

If there is a problem with the API, then you can set a default country to use for popover showing. Set this to false if you’d rather have the popover not show in such circumstances

define(‘PO_DEFAULT_COUNTRY’, ‘US’);

If you liked Pop Up!, you’ll love...

social-marketing
Social Marketing

Build buzz around your product or service with social marketing for easy sharing to Facebook, Twitter, Google+ and more.

in-post-ads
In Post Ads

Display ads throughout your site’s posts and customize how often they appear and where.

simple-ads
Simple Ads

This plugin does the advertising basics – essentially allowing you to simply insert ads before and after post content around your entire site with no option for users to remove them