FROM CACHE - en_header

Blurry homepage image with Debut theme

tree55
Tourist
10 0 2

Hi,

I've spent a good couple of hours trying to get my homepage image on my Debut theme to display correctly.

It looks pixelated and low resolution. I tried png, jpg and removing the colour profiles - still I've been unsuccessful.

All other the images across the site are sharp.

Any tips for resolving?

Here's the link to the site 

https://thegivingchristmastree.com

 

Replies 10 (10)
MS-WEB-DESIGNER
Shopify Partner
3012 181 489

Dear @tree55 

If you add high quality images then need to adjust through CSS

Click Here to Hire Shopify Store Customization Experts
Boost Conversions & Average Order Value with this
Best App for Sticky Add To Cart
Ajay_kumar_dev
Shopify Partner
176 16 14

Hi @tree55  

Try this CSS

image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */

 

-If the problem is solved remember to click to Accept Solution
-if you want to modify or Customize your theme
Hire me
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888

Figma to Shopify |PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO | Speed optimization
tree55
Tourist
10 0 2

Thanks @Ajay_kumar_dev - do I add this code to theme.css?

Ajay_kumar_dev
Shopify Partner
176 16 14
Yes, if this doesn't work , let me know. Will help you out
-If the problem is solved remember to click to Accept Solution
-if you want to modify or Customize your theme
Hire me
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888

Figma to Shopify |PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO | Speed optimization
Ajay_kumar_dev
Shopify Partner
176 16 14

And, update me

-If the problem is solved remember to click to Accept Solution
-if you want to modify or Customize your theme
Hire me
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888

Figma to Shopify |PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO | Speed optimization
tree55
Tourist
10 0 2

@Ajay_kumar_dev, thanks for confirming where to add the code.

 I've added it, but the image still isn't sharp.

Ajay_kumar_dev
Shopify Partner
176 16 14

@tree55 

Most of the time, it works. Maybe we need to look into the theme files. 

-If the problem is solved remember to click to Accept Solution
-if you want to modify or Customize your theme
Hire me
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888

Figma to Shopify |PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO | Speed optimization
Starrla317
New Member
3 0 0

I had the same problem but I don’t know code can you tell me how to remove the gray overlay from my homepage display?

 

tree55
Tourist
10 0 2


##- Please type your reply above this line -

I didn’t resolve the issue. I’d love to know how.



Sent from my iPhone
Starrla317
New Member
3 0 0

I couldn’t fix it but instead I made the image bright and vivid so that it would look closer to the original but it actually came out looking great! StarrlasArt.com

Starrla317_0-1631803707601.png