Top Panel

This panel contains four module positions: panel1, panel2, panel3 and panel4. If none of these have published modules, the panel will be hidden.

You have control over the panel settings. You can change panel's height (currently 250px), width (100%), background color and panel's button text (open/close).

Open
Tue
18
Jan

If you like effect used on the images on this Demo site, you can use it for your site. This template comes with integrated jQuery Lightbox. Please prepare thumbnail image(s) and full size image(s) before proceeding.

To test how Lightbox gallery works, please check Color Schemes page and click on the pictures.

Single Image Lightbox

If you don't know HTML, you can use built-in Joomla editor. What you need to do:

  1. Create a new paragraph and assign "gallery" ID to it
  2. Insert thumbnail image inside
  3. Link the thumbnail image with full-size image
  4. You are done!

HTML view should look close to this example:

<p id="gallery" align="center">
<a href="images/stories/sample.jpg" title="This is module positions layout.">
<img src="images/stories/sample_small.jpg" border="0" width="200" height="152" />
</a>
</p>

Multiple Images Lightbox

Here's what you need to do to make a mini gallery, using Joomla editor:

  1. Create a new paragraph and assign "gallery" ID to it
  2. Make an unordered list
  3. Insert thumbnail image inside every list element
  4. Link each thumbnail image with full-size image
  5. You are done!

HTML view should look close to this example:

<p id="gallery">

<ul>

<li><a href="images/stories/sample1.jpg" title="Step 2"><img src="images/stories/sample_small1.jpg" border="0" width="136" height="100" /></a></li>

<li><a href="images/stories/sample2.jpg" title="Step 3"><img src="images/stories/sample_small2.jpg" border="0" width="120" height="100" /></a></li>

</ul>

</p>

Reflection Effect

Reflection script is incorporated in template. If you want an image to have it, use class "reflect" for your images. You can also control reflection's height and opacity.

Learn more about it here.

HOT Start

Follow our instructions to make a copy of this demo site to your server.

HOT Start! is available with each template. It allows you to create a copy of this demo.

Lightbox Enabled

jQuery Lightbox available. Click on thumbnail picture will open bigger picture in the Lightbox.

Check out how this feature works on this page.