You are here: Home Blog archive 2009 August 26 Simple way to add lightbox/thickbox support to Plone 3 site
Follow us on Twitter
just launched a new Plone site, http://lnkd.in/km2Wpj , for a Kansas City company that builds custom counter tops. Aug 18, 2010 10:03 PM
Injecting Plone variables into javascript:   Step 1: Create a class to output the javascript I created a file in s... http://bit.ly/bjzIzb Jun 22, 2010 10:32 AM
@natea Thx. I'm sitting, writing a presentation for Generic Setup. Your Plone 4 summary is way useful! Apr 27, 2010 09:49 PM
Reminder: Tomorrow is Colorado World Plone Day at the NREL Visitor Center , Golden, CO. http://bit.ly/9611lt #plone #worldploneday #wpd2010 Apr 27, 2010 02:50 PM
@worldploneday: Colorado World Plone Day: This year's Colorado World Plone Day event will be held... http://bit.ly/dinZZn #plone #wpd2010 Apr 19, 2010 04:24 PM
 

Simple way to add lightbox/thickbox support to Plone 3 site

by Chris Crownhart — last modified Aug 26, 2009 12:15 PM

I've been on a constant quest to find a simple way to add lightbox support to a Plone 3 site. Thanks to Products.pipbox, it is easy.

On the old Core Software Group site, I downloaded thickbox and manually added the css and js files to the portal_css and portal_js registries.  It worked, but was kind of kludgy.

Thanks to Steve McMahon's Products.pipbox, it's clean and easy, and gives you a massive amount of flexibility and control.  Here's all I did:

  1. Added Products.pipbox to my eggs section of my buildout.cfg, then ran bin/buildout
  2. Installed pipbox via quickinstaller
  3. pipbox adds a property sheet to portal_properties, which for now, you have to edit via the ZMI
  4. I added the following to /portal_properties/pipbox_properties -> selector specs:
    • {type:'overlay',subtype:'image',selector:'img.image-right,img.image-left,img.image-inline',  urlmatch:'/image_.+$',urlreplace:''}

  5. That's it.  Now our portfolio page uses the lightbox popups to display screenshots of Plone sites we have built.

Next up:

  1. Figure out how to control the position of the popup box.
  2. Figure out how to take advantage of AJAX form support in pipbox.
  3. Figure out how to implement AJAX tabs using pipbox.
Document Actions
Add comment

You can add a comment by filling out the form below. Plain text formatting.

(Required)
Tell us your name.
(Required)
Enter your e-mail address.
(Required)
(Required)
(Required)
Enter the word
 
 
Copyright © 2003-2009 Core Software Group | 303/809-1001 | Fort Collins, Colorado | All rights reserved.