Show second image in product categories page instead of default (cover) image

[kamppa]

How can I show second image on categories page as thumbnails?

product-thumb-tpl has this:

<img
          {if $product.default_image}
            data-full-size-image-url="{$product.default_image.large.url}"
            {generateImagesSources image=$product.default_image size='home_default' lazyload=true}
            alt="{if !empty($product.default_image.legend)}{$product.default_image.legend}{else}{$product.name|truncate:30:'...'}{/if}"
            width="{$product.default_image.bySize.home_default.width}"
            height="{$product.default_image.bySize.home_default.height}"
          {else}
            src="{$urls.no_picture_image.bySize.home_default.url}"
            alt="{$product.name|truncate:30:'...'}"
            width="{$urls.no_picture_image.bySize.home_default.width}"
            height="{$urls.no_picture_image.bySize.home_default.height}"
          {/if}
          class="img-fluid rounded lazyload"
          />

 

But I don't know what should be instead of $product.default_image to show the second image?

[kamppa]

Prestashop 8.1.2

[Mr Rick]

Hello,

 

You can simply use images, it has all the collection.

$product.images

 

[kamppa]

What I mean is that how can this image that is shown for product not be the default cover image but second image?

https://ibb.co/gms6JDV

Edited February 27 by kamppa (see edit history)

[Mr Rick]

You can grab the second image from the array of $product.images.

[kamppa]

I am sorry but I am total noob when it comes to arrays etc. I am fine with editing .tpl files but I don't know what to change to show the other image.

[Mr Rick]

If you do the dump on top of the file, you can see it as an array

{dump($product.images)}

 

For example this code may work for you

 

 {if isset($product.images[1])}
 <img src="{$product.images[1].bySize.home_default.url}" />
 {/if}