Hover Effect Second Photo

New Member
2 0 0

Hello all!

I have the hover effect all set up in my liquid files, everything works perfectly except for one minute detail. It switches to the LAST photo of my listings. I have tried everything I know how to get the code to pull up the SECOND photo but with no luck. Can someone please explain to me how to get the hover effect to switch to the second photo on hover instead of the last?

Thank you!~

0 Likes
Highlighted
Astronaut
761 78 151

Couple ways you could do it. Here you can set an offset and a limit to specifically grab the 2nd:

{% for image in product.images offset:1 limit: 1%}
{{ image | img_url: '400x400' | img_tag }}
{% endfor %}

Where 400x400 is, use whatever size you need.

Or a more straight forward approach would be:

{{ product.images[1] | img_url | img_tag }}

product.images gives you an array of all the images for the product, the number inside the brackets refers to the index of the image. Array indexes start with 0, so 1 would be the 2nd image.
 

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes