Make gifs visible on mobile version

bakyboy
Tourist
27 0 1

Hey, how can I make gifs work on mobile version of my site?

im using the "Showcase" theme, I have gifs on my home page and want it to work on mobile as well. thanks 

0 Likes
Speedimize
Shopify Partner
213 35 93

You can use this code:

@media (max-width: 767px) {
.template-index .product-block .image__second {
     opacity: 1;
  }
}

Hope that helps you.  

We Speedimize your store
Have a problem with speed performance, send me email here: hello@speedimize.io


If our advice was helpful please LIKE or ACCEPT SOLUTION
0 Likes
bakyboy
Tourist
27 0 1

hey, where exactly do I insert it?

0 Likes
Speedimize
Shopify Partner
213 35 93

At the end of style.css file

We Speedimize your store
Have a problem with speed performance, send me email here: hello@speedimize.io


If our advice was helpful please LIKE or ACCEPT SOLUTION
0 Likes
bakyboy
Tourist
27 0 1

thank you! does that mean that the main picture of a product \ collection must be a gif right? it can't be the second picture (like on the desktop with the hover effect)

0 Likes
Speedimize
Shopify Partner
213 35 93

The style that we sent you will always show gifs on mobile phones. Previously, a picture was shown, and on the desktop, when you hover, a gif is shown. But it didn't work on your mobile phone. Now you will always show GIFs on your mobile phone.

We Speedimize your store
Have a problem with speed performance, send me email here: hello@speedimize.io


If our advice was helpful please LIKE or ACCEPT SOLUTION
0 Likes
bakyboy
Tourist
27 0 1

if you can see on my site https://century8mm.com
down on the home page you can see a product that changes to a gif
but on the mobile version it doesn't change to the gif (second product picture)

0 Likes