Popup Block

With the Concrete5 Popup block, you can make links to other pages on your site open with a dialog box. What makes this solution really cool is that it loads your existing concrete5 areas & blocks!  Great for popup photo-enlargement, contact forms, faqs, etc.  

Here are the options:

• You can turn any link into a popup in three ways: via class, css selector, or page path.
• Set up as many "rules" as you'd like, whether each rule shows the page's title, and whether it is modal, which means it closes when you click the background.
• Set the popup to just display the main cocnrete5 area from the page the link points to, or load the complete page (in which case you'd probably want to create a popup page type).
• Popup width can be a percentage of the screenwidth or fixed, and the height can be automatic or fixed.
• You can style you're popup to match your site by picking it's text color, background, border color and width, padding, text-alignment, and title tag.
• Integrated with the Concrete5 Stats package if it's installed, so the hit is tracked when a popup is opened.  
• Works great with SEO, since it uses standard links! 
• Includes English, French & German translations.
• *New - automatic anchor link scrolling

Examples:

Example 1: a standard link, with a class name of "popupLink"

Example 2: with the billboards block inside of it (just to show that javascript loads well), and to demonstrate height resizing.

Example 3: here i'm using the ProPhoto image gallery block to display a collection of images (note that it also works great in filmstrip mode), having those link to a page with the File-Details block, and then applying the popup to those links, by using a "CSS Selector" rule of ".proPhotoWrap a".

Example 4: using the concrete5 popup block with an html image map.

 
Need some help?  Here's a video tutorial & a text walk-through tutorial
 

 
Screenshots:

 
(A couple of caveats on the popup block. Firstly, although this package does a good job at running other blocks inside of the popup, some blocks may have issues.  The required block type javascript and css libraries are automatically loaded only when loading an area from another page, but if you choose to use the full-page view option, then you're going to want to make a custom "popup" page type for your site that includes just the required libraries for that block, and not the entire header_required include.)

Like this post?