» Popup Pro

It's so easy novices can use it. It's so powerful experts will love it.

Making a cool popup overlay is now easier than ever. This add-on allows you to turn any text or image into a link that will create an overlay (popup) to show content, videos, flash animations, photos and more.

It is jam-packed full of flexible options so you can configure it to do just about anything: create a single popup, gallery-style popup with multiple photos or videos, and even display the popup automatically as soon as the page loads.

Even better, you can optionally display a Twitter & Facebook social sharing link which allows your visitors to easily tell their friends about the text/photos/video on your website.

This add-on is essential on every Concrete5 site - you won't know how you lived without it!

Download from the Concrete5 Marketplace ($15)


  • Easy to configure - no need to understand CSS or complex coding
  • 13 different pop-up styles including: Simple content, iFrame, AJAX, Quicktime Movie, Flash Animation, Vimeo, YouTube and Photo.
  • Able to pull in popup content locally from your website, or from an external 3rd party website.
  • Play YouTube and Vimeo videos inside the popup
  • Use text or an image from your File Manager as the link "anchor"
  • Easily set a optional title and description for the popup ("title" appears above the popup, "description" appears at the bottom inside the popup)
  • 6 different skins included (both light and dark)
  • Configure the popup height and width (where available)
  • Optionally display the popup automatically as soon as the page loads - ideal for newsletter subscription forms
  • Gallery support - link multiple images or videos on the same page to create your own customer gallery. Users can navigate between images/videos without closing the popup
  • Optionally display "tweet" and "like" buttons for integration with Twitter & Facebook. This is an excellent way for visitors to share content on your site with their friends and family.
  • History support for forward/back navigation in your web browser. If a popup was open when you left the page, when return (using the "back" button) the popup will still be open.
  • NEW (1.6.1): now supports easy WYSIWYG editor for direct content entry for simple popups

Ideal Uses:

  • Play a video without taking up lots of space on your page. Simply show a small thumbnail image that users click on to start the video playback (in the popup)
  • Display more detailed content without waiting for a new page to load, and saving space on the current page.
  • Display a newsletter registration form by utilising the option to automatically load the popup on page load.
  • Display important news or a notification, again with the automatic popup option.
  • Create a flexible photo gallery with several photos scattered around the page, but the user can navigate from photo to photo within the popup.


If you want to show formatted text or a form inside your popup, you can use the "simple content" option, o or if you want more control simply follow these steps:

  1. Add a new page to your website and hide it from the navigation menu (use the "exclude from nav" custom attribute)
  2. Install and apply The Void theme (free) to this new page (not to your whole site).
  3. Add any content or forms you wish to display.
  4. On the page where you want to display the popup, add a Popup Pro block and choose the "iFrame (same site)" popup style and select the newly created page. Configure any other options for your popup (such as height & width).

Presto! You have a cool popup with easily configurable content.


Advanced Tips:

If you want to automatically close the popup after a specific page is loaded, just add this Javascript code to the relevant place inside the page that is appearing within your popup (assuming your using an "iFrame" popup style). For example, this could be used to automatically close the popup after a form is submitted.

<script type="text/javascript">

You can also use something similar to manually close the popup from a link within:

<a onclick="window.parent.$.prettyPhoto.close();" href="#">Close this popup</a>


Click each link (and image) below to view various popup styles.

Example of image only anchor

Sample skins included:

These popups below use the "Popup Pro" add-on as well.

Demonstration Video:


See answers to common questions about this add-on