Mika Tuupola

Some people consider it to be heretic to use jQuery with Ruby on Rails. Since I am big fan of jQuery I decided to do it anyway.

With filtered_column_thickbox_macro you can display single or multiple images with Lightbox effect. Macro uses Cody Linley’s ThickBox plugin. Code is based on Based on Christian Lim’s Lightbox Image Gallery Filter.

Installation

Install by issuing command (in one line):

script/plugin install  
http://svn.appelsiini.net/svn/rails/plugins/filtered_column_thickbox_macro/

Script will copy needed Javascript, CSS and image files into your public folder. It does not overwrite any existing files. So if you rely in specific version of jQuery library it will be safe.

Usage

After installing you need to add following to your layout.liquid.

{{ 'thickbox' | stylesheet }}
{{ 'jquery' | javascript }}
{{ 'thickbox' | javascript }}

Then in your posts drag assets between <filter:thickbox> and </filter:thickbox> tags.

 <filter:thickbox>
 http://www.example.com/assets/2007/3/20/image_1.jpg
 http://www.example.com/assets/2007/3/20/image_2.jpg 
 http://www.example.com/assets/2007/3/20/image_3.jpg
 </filter:thickbox>

Optionally you can also add captions and/or group images:

 <filter:thickbox group="somename">
 http://www.example.com/assets/2007/3/20/image_1.jpg Lorem ipsum.
 http://www.example.com/assets/2007/3/20/image_2.jpg Dolor sit.
 http://www.example.com/assets/2007/3/20/image_3.jpg Amet. 
 </filter:thickbox>

When you group images together ThickBox will display next – prev links.