Product image default hover to image position 2

Store Design
, ,
1

My theme switched product image default to image position 2” that hover to the same image "position 2”.

How do I change the default image product to image “position 1” that will hover to image ‘position 2’ ?

You help is appreciated.

Store address: www.visualwallart.com

2

Hello @vwa-decor ,

It seems like the default product image is set to image position 2 on hover, but you’d like to change it so that image position 1 is shown as the default image and then hover displays image position 2.

To make this change, you’ll likely need to adjust the product image settings in your theme’s JavaScript or Liquid files. Here’s how to approach it:

Follow these steps:

  1. Online Store

  2. Themes

  3. Edit Code

  4. Find the product-template.liquid or the relevant file under Sections or Snippets where product images are rendered.

  5. Look for the code related to the product images, which may involve loops displaying the image positions.

  6. Modify the Image Order:

-Identify the code that defines the image positions (like image_1, image_2).

-You’ll likely find something like this:

{% assign first_image = product.images[0] %}
{% assign second_image = product.images[1] %}

To make image position 1 the default image, ensure that the first image is set as the default for the main image view and that the second image appears on hover.

  1. Edit the Hover Effect:

  • Locate the hover functionality, often in the theme’s JavaScript files (like theme.js).

  • If there’s an image swap event triggered on hover, modify it to trigger from the correct positions.

If you prefer, I can assist you further with specific code snippets or guide you through more detailed changes. Let me know!

If I was able to help you, please don’t forget to Like and mark it as the Solution!
If you’re looking for expert help with customization or coding, I’d be delighted to support you. Please don’t hesitate to reach out via the email in my signature below—I’m here to help bring your vision to life!

Best Regard,
Rajat Sharma

3

Hello,

Thank you for replying,

But there is nowhere I can find “product-template.liquid”

4

Hey @vwa-decor

websensepro_0-1734424964442.png
websensepro_0-1734424964442.png1361×598 367 KB

If my reply is helpful, kindly click like and mark it as an accepted solution.

If you are happy with my help, you can help me buy a COFFEE

Thanks!