Prints product images in a thumbnail size.

Kuvaus

If the product has only one image, it can be omitted from the preview list by using the attribute showall:false. In such case, the product's only image won't be unnecessarily displayed both as the main image and on the thumbnail list.

Syntaksi

{ProductThumbnails( imagesize: string, width: string, height: string, showall: boolean, helper: string )}

Näkyvyys

Toimii näkyvyydessä: tuote

The required scope is always set in the following templates:

Templates
Single product template
Product images

Printing product images on the product card

This example shows one of the ways in which product images can be printed on the online store's product page.

In MyCashflow's default theme, product images are printed using the {ProductImages} tag, which prints all images of the product.

<div id="ProductImages"> <figure class="main-image"> {ProductImage} <figcaption> {ProductImageCaption} </figcaption> </figure> {ProductThumbnails} </div>

The main image of the product is printed using the {ProductImage} tag.

Attribuutit

imagesize:

Defines printed image's dimensions.

The values to be used are determined based on the values of the theme settingsImageSizes element.

Allowed values: Names of image sizes defined in the ImageSizes element of the theme.xml file

E.g. imagesize:'Large'

height:

Defines image height given in pixels.

Allowed values: integers.

width:

Defines image width given in pixels.

Allowed values: integers.

helper:

Defines the content and output format of a single list element.

Allowed values: the Interface and HTML markup that define the output's markup and content.

The helper attribute can be used in two ways:

  • you can indicate the desired markup directly as the attribute's value, or
  • you can indicate a reference to a file with the desired markup as the attribute's value. The reference should be indicated in relation to the theme's root directory.

See also detailed instructions on using the helper attribute.

showall:

If the attribute's value is false, it will prevent the thumbnail list from being printed if there is just one product image.

Allowed values: true / false. The default value is false.

before/after:

With the before and after attributes, you can define content that is output before or after the content produced by the tag.

Allowed values: text that may contain HTML and Interface markup.

E.g.

  • before: '<p>This markup appears before the tag's own content.</p>'.
  • after: '<p>This appears after the tag's own content.</p>'

If the tag does not produce any content, the content of the before and after attributes will also not be displayed.

or:

Defines alternative content that is displayed if the tag itself does not produce any content.

Allowed values: text that may contain HTML and Interface markup.

E.g. or:'Content not found.'