Images get blurred in Mobile devices

Solved
Bdelucca
Excursionist
15 1 2

Hello everyone. 

I'm using small images to show alternatives for the shoes. The images work perfectly in desktop, but in mobile they get blurred. I had the same issue with the main image of the shoe and I work around it using a lazyload function. Now it doesn't work and I want to know the reason why. 

Here is the preview of the theme.

Link

The objective images are the small shoes that appears when you hover over a shoe in the home page.

Bdelucca_1-1616152030933.png

Regards!

0 Likes
OpenThinking
Shopify Partner
239 56 70

This is an accepted solution.

Hi there,
Jack from OpenThinking here!

You need to find the file where those cards are located, and change the image size with something like this:
{{ img | img_url: '72x' }} to something bigger {{ img | img_url: '1080x' }}

Unfortunately I can't say which files you've to look at nor the exact code to change.


let me know if this works for your. If yes; accept my answer and give me thumbs up! Thank you.

⚡️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
⚡️ Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]
Bdelucca
Excursionist
15 1 2

Works Perfectly! Is this loading a large image? 

0 Likes
OpenThinking
Shopify Partner
239 56 70

Yes, it is. So I suggest loading around 150x or 200x

⚡️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
⚡️ Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]
0 Likes