Slim Box and Album {solved}

[kcharity]

I have a version of album running Slimbox however I am having issues with it....

Previous and next are not appearing when rolling over images.
Caption will appear but how to I remove the file name?
How do I add image x of x?

I have looked on Slimbox site but have not been able to find out how to do this. Any help would be great.

thanks

K

[kcharity]

So after spending some more time with it I answered my own questions. The solution was in the album template. For anyone wondering how I did it here is the template.

Code: Select all

{* Include JS files. You can move this to the head of your page template if you want *}
<!--Slimbox stuff-->
<link rel="stylesheet" href="modules/Album/templates/db/slimbox/css/slimbox.css" type="text/css" media="screen" />
<__script__ type="text/javascript" src="modules/Album/templates/db/slimbox/js/mootools.v1.1.js"></__script>
<__script__ type="text/javascript" src="modules/Album/templates/db/slimbox/js/slimbox.js"></__script>

{* Album List *}
{if !$album}
<ul class="albumlist">
	{foreach from=$albums item=album}
	<li class="thumb">
 	<a href="{$album->link}">
<img src="{$album->thumbnail}" alt="{$album->name}" title="{$album->name} - {$album->comment}" /></a>

<p class="albumname">{$album->name}<br />
<span class="albumpicturecount">({$album->picturecount} images)</span><br />
<span class="albumcomment">{$album->comment}</span></p>
</li>
	{/foreach}
</ul>

{else}

{* Photo List *}
<p><strong>{$album->name}</strong><br />
{$album->comment}<br />
<span class="instructiontext">Click on a thumbnail to view a larger image. Click on the larger image, to close it. {if $returnlink}<a href="{$returnlink}">Return to the album index page</a>{/if}</span></p>

	{if $pagecount>1}
	<p class="albumnav">
		<a href="{$link.page.first}" title="first page"><< </a>
		{if $link.page.previous}<a href="{$link.page.previous}" title="previous page">< </a>{/if}
		page {$pagenumber}/{$pagecount}
		{if $link.page.next}<a href="{$link.page.next}" title="next page"> ></a>{/if}
		<a href="{$link.page.last}" title="last page"> >></a>
	</p>
	{/if}

<ul class="picturelist">
	{foreach from=$pictures item=picturesrow}
	    {foreach from=$picturesrow item=onepicture}


<!--This is the important part that I needed to add per Slimbox website, specifically the rel="lightbox[anynamehere]" I then modified the tag to include "title" and associated the comment -->


	    <li class="thumb"><a href="{$onepicture->picture}" rel="lightbox[album]" title="{$onepicture->comment}"> <img src="{$onepicture->thumbnail}" alt="{$onepicture->name} - {$onepicture->comment}" title="{$onepicture->comment}" /></a>
   	   </li>

      {if ($onepicture->number==$picturenumber and !$picture)}{assign var=picture value=$onepicture}{/if}
	    {/foreach}
	{/foreach}
</ul>

{if $picturecount==0}No image{/if}
{/if}

{if $picture->id>0}
{/if}
<div style="clear:both"></div> 

I hope this helps someone.