Images

The following placeholders are all related to the item's images.

MainImageURL

Contains the URL of the main image. Depending on what is set as the size in the template options, this can be the SmallImageURL, MediumImageURL or LargeImageURL.

MainImageWidth

Contains the with in pixel of the main image, e.g. "75". Depending on what is set as the size in the template options, this can be the SmallImageWidth, MediumImageWidth or LargeImageWidth.

MainImageHeigth

Contains the height in pixel of the main image, e.g. "75". Depending on what is set as the size in the template options, this can be the SmallImageHeight , MediumImageHeight or LargeImageHeight .

SmallImageWidth

The width of the small image in pixel, e.g. "75".

SmallImageHeight

The height of the small image in pixel, e.g. "75".

SmallImageURL

The URL of the small image.

<img src="{{ SmallImageURL }}" width="{{ SmallImageWidth }}" height="{{ SmallImageHeight }}">

MediumImageWidth

The width of the medium image in pixel, e.g. "160".

MediumImageHeight

The height of the medium image in pixel, e.g. "120".

MediumImageURL

The URL of the medium image.

<img src="{{ MediumImageURL }}" width="{{ MediumImageWidth }}" height="{{ MediumImageHeight }}">

MissingImageUrl

Contains the URL to an image that symbolizes a missing product image.

MissingImageWidth

The width of the missing product image in pixel.

MissingImageHeight

The height of the missing product image in pixel.

LargeImageWidth

The width of the large image in pixel, e.g. "500".

LargeImageHeight

The height of the large image in pixel, e.g. "380".

LargeImageURL

The URL of the large image.

<img src="{{ LargeImageURL }}" width="{{ LargeImageWidth }}" height="{{ LargeImageHeight }}">

ImageSetsArray

An array containing all information about the product images delivered by Amazon API. It can be used best by looping through the contents like this lightbox gallery example shows:

{% if ImageSetsArray is not empty %}
    <h4>Gallery</h4>
    <div class="asa2_gallery">
    {% for imgSet in ImageSetsArray %}
        <a href="{{ imgSet.LargeImage.URL }}" rel="lightbox[{{ ASIN }}]"><img src="{{ imgSet.MediumImage.URL }}" /></a>
    {% endfor %}
    </div>
{% endif %}

ImageSetsTotal

The total amount of image sets (integer).

ImageSetsArray|gallery

The gallery filter is a very useful helper to get an HTML formatted list out of Placeholder Imagesets.

By default, it generates a <ul><li> list with images in "small" format which are linked to images in "large" format. But this can be customized completely.

// Default parameters
gallery($thumbSize = 'small', $targetSize = 'large', $outer = '<ul>%s</ul>', $inner = '<li>%s</li>', $link = '<a href="%s">%s</a>')

Options

Parameter	Description	Default
$thumbSize	The size of the thumbnail images. If there is no image with this size, the loop will continue.	small
$targetSize	The size of the linked images. If there is no image with this size, no image will be linked. To prevent linking to a larger size image, set it to false.	large
$outer	The outer list container. It must contain "%s" where the list will be inserted.	<ul>%s</ul>
$inner	The list item container. It must contain "%s" where the image will be inserted.	<li>%s</li>
$link	The target link format. Must contain two "%s". The first for the target image URL, the second for the thumbnail image.	<a href="%s">%s</a>

Possible images sizes
swatch
small
thumbnail
tiny
medium
large
hires

Example with custom outer class and lightbox:

{{ ImageSetsArray|gallery("medium", "large", "<ul class='product_gallery'>%s</ul>", "<li>%s</li>", "<a href='%s' rel='lightbox'>%s</a>") }}

Example for showing the large images without links:

{{ ImageSetsArray|gallery("large", false) }}

ImageSetsArray|get

With filter get on placeholder ImageSetsArray you can access single images of a product.

Usage in templates

This example will build an img tag with the second image of the image set in medium size:

<img src="{{ ImageSetsArray|get(2, 'medium', 'url') }}">

This example will generate an img tag with image number 9 and large size:

{{ ImageSetsArray|get(9, 'large') }}

Usage in shortcodes

This example will generate an img tag with image number 12 in large size:

[asa2 value="ImageSetsArray|get(12, 'large')"]B00SDTTH5E[/asa2]

Options

Parameter	Description	Default
$number	The number of the image. If there is no image with this number, the result will be empty.	1
$size	The size of the image. If there is no image with this size, the result will be empty.	large
$type	The result type. "tag" will return an img tag ready to use. "url" will return image URL.	tag

Possible images sizes
swatch
small
thumbnail
tiny
medium
large
hires