Blog Post Image Blurred

[nicholas3d]

Blog post image was too small even though uploaded 2000x3000px image.

Added CSS code

**<style> .article-template__content.rte img { width: 100%; } </style>**

Image enlarged but blurred. Any help? 

https://www.3dots.com.my/blogs/events/kelantan-outing-camera-camp-2024

[PaulNewton]

Hi @nicholas3d 👋 If an image is blurry that typically means the actual image itself needs to be a higher resolution either by:

Adding a better resolution file to posts content

Customizing the theme to serve larger resolution images IF higher resolution is available that is.

Or other styles made be distorting the image either with improper height, aspect-ratio, or filters.

You may also want to add a rule to override and preset max-width: 

  max-width: max-content;

[MooseDesk]

Hi @nicholas3d ,

Thanks for reaching out to the Shopify Community! We're MooseDesk, your go-to Live Chat, FAQ & Helpdesk App here to help you enhance your customer support experience.

The CSS code you tried might be causing the image to stretch beyond its original dimensions, leading to blurriness. Instead, you could try this CSS code, which I've tested and found effective in addressing your issue:

.article-template .article-template__content {
  max-width: max-content;
}

This code allows the content area to expand to accommodate the full size of your image without forcing it to stretch. It should help maintain the image quality while displaying it at a larger size.

I hope this answer addresses your question effectively. If you found it helpful, we’d appreciate a 'LIKE' for MooseDesk. If your issue is resolved, please mark this as 'SOLUTION’.

In the meantime, our MooseDesk Team is always here to help with customer support solutions. We’re passionate about improving your customer experiences through our Live Chat, FAQ, and Helpdesk App.

With MooseDesk, you can engage with customers through omnichannel support, manage inquiries with a robust ticket system, and provide quick responses.

• Or you can let customers resolve questions faster with in-built FAQ, Order tracking module, and more.

Once again, keep up the fantastic work, and I wish you the best of luck in the future!