Javascript Dateien:

  /modules/lib_jquery/plugins/fancyBox2/jquery.fancybox.pack.js
  

Javascript Dateien optional

  /modules/lib_jquery/plugins/fancyBox2/helpers/jquery.fancybox-buttons.js
  /modules/lib_jquery/plugins/fancyBox2/helpers/jquery.fancybox-media.js
  /modules/lib_jquery/plugins/fancyBox2/helpers/jquery.fancybox-thumbs.js
  

CSS Dateien:

  /modules/lib_jquery/plugins/fancyBox2/jquery.fancybox.css
  

CSS Dateien optional

  /modules/lib_jquery/plugins/fancyBox2/jquery.fancybox-buttons.css
  /modules/lib_jquery/plugins/fancyBox2/jquery.fancybox-thumbs.css
  

Javascript Code:

$(document).ready(function() {
    $(".lb_group").fancybox({
        beforeLoad: function() {
            this.title = $(this.element).parent().find('span.caption').html();
        },
        helpers: {
            title : {
                type : 'inside'
            }
        }
    });
});

Ausgabetemplate:

    <h2>{$settings.images_title}</h2>
    <ul class="fgLightbox">
    {foreach $images img}
    	<li class="rounded" style="width:{$li_width}px;height:{$li_height}px;">
    		<a style="line-height:{$settings.thumb_height}px;" class="lb_group" rel="lightbox-grouped"
               href="{$BASE_URL}{$current_path}/{$img.file_name}"
               title="{if $img.caption}{$img.caption}{else}{$img.file_name}{/if}">
                <img src="{$BASE_URL}{$current_path}/{$settings.thumb_foldername}/thumb_{$img.file_name}" alt="{$img.caption}" title="{$img.caption}" />
                <span class="caption rounded gradient1">{$img.description}</span>
            </a>
    	</li>
    {/foreach}
    </ul>
    <script charset=windows-1250 type="text/javascript">
    {$javascript_code}
    </script>