Low Quality Images in the Damn Theme 15.0.2 Mobile version

[Sohayl67]

Hello i have an issue with the damn theme 15.0.2 on my mobile Version , in fact the slides , pictures and images are all low quality zoomed in , and blurry i dont know why but it's automatically like this and low quality how can i repair this issue??? lots of people of the community gave me some codes but they didnt workout for me

[websensepro]

Hi  , kindly provide your store URL please and if it is password protected, please share the password as well. Thanks

[rajweb]

Hey @Sohayl67 ,

To fix blurry, low-quality images on your mobile version in theme 15.0.2:

1. Upload High-Resolution Images: Ensure your images are at least 2048px wide for better clarity.'

2. Adjust Theme Settings:  Check your theme customization for image quality or resolution options.

3. Add Custom CSS:Use this code to improve sharpness:

.slideshow__image, .product__image, .featured-image {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: bicubic;
}

4. Disable Lazy Loading:  If your theme uses lazy loading, try disabling it with this CSS:

img[loading="lazy"] {
    loading: auto !important;
}

5. Check for App Conflicts: Disable any apps or custom code that might be affecting image quality.

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

[PageFly-Richard]

Hi @Sohayl67 

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<script>
window.addEventListener('DOMContentLoaded',function(){
document.querySelectorAll("#MainContent img").forEach(img => {
    img.removeAttribute("srcset");
});
})
</script>

Hope this can help you solve the issue 

Best regards,

Richard | PageFly