Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 2 Next »

Introduction

This tutorial shows how to use velocity code and conditional statements within your catalog templates to display an items multimedia.  This velocity code example is intended to be used with the catalog templates:

Sample Code

                #if($item.getMultimedia("Image") && $item.getMultimedia("Image").size() > 0)
                 <a href="$item.getDefaultMultimedia('Image').getViewUrl()" title="$item.getDescription()">
                   <img src="$baseThumbnailUrl$item.getDefaultMultimedia('Image').getThumbnail(240)" alt="$item.getDescription()" width="240" height="240"  />
                 </a>
                #else
                 <img src="$baseUrl/assets/images/200x200_default.jpg" alt="Image coming soon"/>
                #end

Break Down

Condition
#if($item.getMultimedia("Image") && $item.getMultimedia("Image").size() > 0)

Here we have looped through the item to see if there are any multimedia files with the code "image". If the condition is true the following code is output:

Statement One
                 <a href="$item.getDefaultMultimedia('Image').getViewUrl()" title="$item.getDescription()">
                   <img src="$baseThumbnailUrl$item.getDefaultMultimedia('Image').getThumbnail(240)" alt="$item.getDescription()" width="240" height="240"  />
                 </a>

#else

If there is no multimedia uploaded to the item with the code "Image" then the #else condition is true and the following code is output:

Statement two
<img src="default.jpg" alt="Image coming soon"/>

This line displays a default image as a place holder until an image can be upload for the item.

 

  • No labels