Tuesday 15 January 2013

Enable Use Lightbox in Joomla 2.5/3.0


If you decided that you want to have a lightbox on your Joomla site, you probably know what is it about. But, let’s just mention that the Lightbox is a JavaScript technique to display images and content using modal dialogs. Why do you need this? Because it’s clean, nice looking, effective and easy for implementation.
We will learn how to display
  •     images in modal popup window
  •     external content
First thing we have to do is to add a bit of JavaScript support to our page.
To do this, paste the following code in the top of your main template file (ex. index.php) :


 When you did this, just use the link in the following format in your article or page.

< a href=”my-url” class=”modal”> Image or Text for a popup < /a>


For displaying content in the modal popup window you need a bit more code:

< a 
href="/sample/lightbox.html?map=1&act=3"
 class="modal" rel="{handler: 'iframe', size: {x: 575, y: 300}}">link
 to a modal popup with a dimension of 600px by 300px< /a> 

 It’s pretty much same as displaying images, expect we have “rel” attribute where we are saying that iframe should be used, and we also define exact size of the window were our content will be displayed.

source