Cataloger item images help needed

[delve2013]

In the cataloger module I am displaying 10 to 12 thumbnail images which when clicked display a larger version of the image. What I want to do is hide the very first image.

Can anyone help with this?

my item page template looks like this:

Code: Select all

<div class="catalog_item"><h2>{$title}</h2><div class="item_images">

<a href="{$image_1_url}" class="MagicZoom" 
rel="zoom-width:400; zoom-height:300; opacity-reverse: false; zoom-fade:true; zoom-fade-in-speed: 1200; zoom-fade-out-speed: 800; selectors-effect-speed: 1200; selectors-effect:fade;" 
id="zoom"><img id="item_image" name="item_image" src="{$image_1_url}" alt="{$title}" title="{$title}" /></a>

<div class="item_thumbnails">
{section name=ind loop=$image_url_array}

<a href="{$image_url_array[ind]}" rel="zoom-id:zoom" rev="{$image_url_array[ind]}"><img src="{$image_thumb_url_array[ind]}" title="{$title}" alt="{$title}" /></a>{/section}

</div></div>{section name=at loop=$attrlist}<div class="item_attribute_name">{$attrlist[at].name}:</div>{/section}{literal}<__script__ type="text/javascript">function repl(img)   {   document.item_image.src=img;   }</__script>{/literal}{if $file_count > 0}<ul class="files">{section name=ind loop=$file_name_array}<li><a href="{$file_url_array[ind]}">{$file_name_array[ind]}</a></li>{/section}
<div class="variant">
{$variant}
</div>
</ul>{/if}
</div>

[Jo Morg]

I'm not sure if that is what you want and I didn't test this but something like:

Code: Select all

# ....
<div class="item_thumbnails">
{section name=ind loop=$image_url_array}
   {if $ind == 0}## or $ind == 1 not sure here...
      {* skip this iteration *}
      {continue}
    {/if}
# .... rest of the code

As I said, not tested. HTH

[delve2013]

Thanks but that's not having any effect unfortunately.

[Jo Morg]

Try this instead:

Code: Select all

# ....
<div class="item_thumbnails">
{section name=ind loop=$image_url_array}
   {if $smarty.section.ind.index == 0}
      {* skip this iteration *}
      {continue}
    {/if}
# .... rest of the code

But either way its a simple to solve Smarty problem.

[delve2013]

i gave this a go and it hides the other images but keeps the first image visible. I think you're getting close..

[Jo Morg]

If you could post what you already have on the template would help.
Otherwise is just guess work...

[delve2013]

This is the template for the item page

Code: Select all

<div class="catalog_item"><h2>{$title}</h2><div class="item_images">

<a href="{$image_1_url}" class="MagicZoom"
rel="zoom-width:400; zoom-height:300; opacity-reverse: false; zoom-fade:true; zoom-fade-in-speed: 1200; zoom-fade-out-speed: 800; selectors-effect-speed: 1200; selectors-effect:fade;"
id="zoom"><img id="item_image" name="item_image" src="{$image_1_url}" alt="{$title}" title="{$title}" /></a>

<div class="item_thumbnails">
{section name=ind loop=$image_url_array}

<a href="{$image_url_array[ind]}" rel="zoom-id:zoom" rev="{$image_url_array[ind]}"><img src="{$image_thumb_url_array[ind]}" title="{$title}" alt="{$title}" /></a>{/section}

</div></div>{section name=at loop=$attrlist}<div class="item_attribute_name">{$attrlist[at].name}:</div>{/section}{literal}<__script__ type="text/javascript">function repl(img)   {   document.item_image.src=img;   }</__script>{/literal}{if $file_count > 0}<ul class="files">{section name=ind loop=$file_name_array}<li><a href="{$file_url_array[ind]}">{$file_name_array[ind]}</a></li>{/section}
<div class="variant">
{$variant}
</div>
</ul>{/if}
</div>

[Jo Morg]

mmm.... and where did you use the code snippet I posted? I don't see it there....

[delve2013]

Sorry.. just realised I pasted the wrong code..

I can't remember where I used your code snippet..

it was from this bit, that's all I remember:

Code: Select all

<div class="item_thumbnails">
{section name=ind loop=$image_url_array}

[delve2013]

I actually got this done by using the following:

Code: Select all

{section name=ind loop=$image_url_array}
{if !$smarty.section.ind.first}
<a href="{$image_url_array[ind]}" rel="zoom-id:zoom" rev="{$image_url_array[ind]}">
<img src="{$image_thumb_url_array[ind]}" title="{$title}" alt="{$title}" />
</a>
{/if}
{/section}

This method removes the first thumbnail image but does not remove the first large image. However when you click on another thumbnail image in the list, the first large image disappears and will not longer appear. Not exactly what I wanted but it works.