CMS Made Simple Forums

Code: Select all

{cms_module module='album' albums='22'}

Code: Select all

{* This template lists thumbnails in a table and the full size versions are shown in a popup *}
{* Modified version providing an additional table cell with picture comment in case there is one *}

{* Open image table *}
 <table class="pictable" summary="{sitename}, {$album->name}" cellspacing="0" cellpadding="0">

	{foreach from=$pictures item=picturesrow}
		<tr class="picrow">
		
		{foreach from=$picturesrow item=onepicture}
{* Add comment only if that picture does have a comment *}		
			<td class="commentcell">
			{if $onepicture->comment!=''}{$onepicture->comment}{/if}
			</td>
			
{* Add thumbnail pics *}
			<td class="piccell">
				<a href="javascript:PopupPic('{$onepicture->picture}','{$onepicture->name|replace:'\'':'\\\''}','{$onepicture->width}','{$onepicture->height}')"> <img src="{$onepicture->thumbnail}" alt="{$onepicture->name}" /></a>
			</td>
{* Close down image table *}
			{if ($onepicture->number==$picturenumber and !$picture)}{assign var=picture value=$onepicture}{/if}
		{/foreach}
		</tr>
	{/foreach}
 </table>
 
{* Notifier in case of no images *}
{if $picturecount==0}No images.<br/>Keine Bilder.{/if}

Code: Select all

/* POPUP TABLE GALLERY */
/* NOTE: These css styles go for thumbnails with either
a height or a width of 150px. Less should be okay, for
larger thumbs you'd need some adjustments.*/

table.pictable {
 border:0;
}
tr.picrow {
 height:150px; /* change to your thumbnail height */
 vertical-align:middle;
}
td.piccell {
 width:150px; /* change to your thumbnail width */
 text-align:center;
}
td.commentcell {
 text-align:left;
 vertical-align:top;
 padding-right:20px; /* some air to the thumbnails */
 font-size:xx-small; /* small font-size, change if you want it larger */
}
/* END POPUP TABLE GALLERY */