Hi! I want the product cards to show their second image on hover, I have checked the option and it works on desktop, but it doesn’t work on mobile… I need it to work on mobile too. Any help please? Here’s the store https://agori-jewellery.com/ I’m using Dawn 7.0.1

Hi @agori May I suggest to update code these steps: Go to Store Online-> theme → edit code Assets/component-card.css Add code below to bottom of file .card-wrapper:hover .media.media--hover-effect>img:first-child:not(:only-child) { opacity: 0; } .card-wrapper:hover .media.media--hover-effect>…

Hello I’m using impact theme version 4.3.4 and I want to implement this mobile hover image transition I’ve tried most of solutions above but they did not work can you provide any tips for me https://www.boujisphere.com/ this is my website link

Hi, May I suggest to update code these steps: Go to Store Online-> theme → edit code [EBOOST_0-1703652894866.png] Assets/theme.css Add code below to end of file body .product-card--show-secondary-media .product-card__figure:hover .product-card__image--primary { opacity: 0; } body .produ…

Hello, Thank you for your message. Please note I do not have " Assets/theme.css" in my coding. Can you please advise. Thank you, Hani Hachache

Hi Hani, With your case. May I suggest to update code these steps: Go to Store Online-> theme → edit code Layout/theme.liquid Add code below to end of file and before tag [EBOOST_0-1703667370543.png]

Hello, Thank you for your support. Unfortunately it did not work. I still need to press on the description or the price to enter the page to buy it. Can you please support. Thank you, Hani Hachache

Hello, Yes, I added it. My website is www.griffjewelry.com Thank you

Hi, With this store. Maybe I suggest code below: Note: When you use this code after you need touch twice times to redirect to product page. the first touch will show the second image. The second touch will go to product page.

Hello again. Thank you for your support. It is not working properly: I touch one time the first picture, it shows the second picture and redirect me directly to the product page. All this in one touch instead of 2 touches. Please advise. Thank you, Hani

Heelo Again E boost thanks for your assistance but unfortunately the code you provided me earlier didn’t work as intended infact it just disaple the product image from being clicked but it didn’t give me the hover affect I wanted …

How can I enable second image hover on mobile product cards?

Store Design

EBOOST December 27, 2023, 2:17pm 87

Hi,

Did you add code above? I checked your store (https://www.efcollection.com/). However, I don’t see the code.

Topic		Replies	Views
Show second image on hover ( DAWN Theme ) Store Design	16	220	June 23, 2023
Reveal second image on hover - Debut theme Store Design	134	1623	November 9, 2023
Product card second image on hover/touch for mobile Store Design design	2	56	January 18, 2025
Collection - Add a hover effect to product images on your collection pages Store Design	87	1831	February 27, 2024
Image on hover on product card not be second image Store Design design , customizations , css , shopify-themes , troubleshooting	22	246	July 29, 2025

How can I enable second image hover on mobile product cards?

Related topics