I know this question has been asked, but the image banner on my website is burred upon uploading. I’ve tried many different formats and resolutions/aspect rations. I know it’s something with the code in the image-banner.liquid but I am having trouble editing the code so the resolution of the banner …

Hi @niko585 , Please change all code: {{ 'section-image-banner.css' | asset_url | stylesheet_tag }} {%- if section.settings.adapt_height_first_image and section.settings.image != blank -%} {%- style -%} @media screen and (max-width: 749px) { #Banner-{{ section.id }}::before, #Banner-{…

Hi @niko585 , The good banner size for these days is 1920px X 1080px (Full Screen Presentation). For the mobile banner size is 480px X 480px (but I use 840px X 840px for mobile & tablet). If you spend a bit more time editing the images (for sharpening & brightness adjustment), you can make the im…

@niko585 Shopify Dawn Theme Image Sizes Image Type Width Height Aspect Ratio Product Image 700px 700px - Collection Image 550px 550px 1:1 Slideshow Image 1600px 1050px - Blog Post Image 720px 1080px - Text Overlay Image 1600px 1050px - Image Sizing Tips for Dawn Theme Use the a…

Hi @niko585 , If you want it to display the correct resolution of the image, please send me the code of the image-banner.liquid file, and I will help you to change it.

{{ ‘section-image-banner.css’ | asset_url | stylesheet_tag }} {%- if section.settings.adapt_height_first_image and section.settings.image != blank -%} {%- style -%} @media screen and (max-width: 749px) { #Banner-{{ section.id }}::before, #Banner-{{ section.id }} .banner__media::before, #Banner…

When I apply your changes the banner image no longer loads and is replaced by a blank grey canvas.

I just changed 750 to 3480 instead of master and it worked. THANK YOU!!!

Can you please let me know where you changed the 750 to 3480?

{{ section.settings.image | image_url: width: 3840 | image_tag: loading: 'lazy', width: section.settings.image.width, height: image_height, class: image_class, sizes: sizes, widths: '375, 550, 750, 1100, 1500, 1780, 2000, 3000, 3840', alt: sec…

Why is my Dawn theme banner image blurry and how can I fix it?

Store Design

niko585 August 16, 2022, 10:31pm 6

Thank you for offering to help. If you could let me know what you did that would be greatly appreciated!

Topic		Replies	Views
Why is my Dawn theme banner image appearing blurry? Store Design	11	102	November 15, 2022
Dawn theme 11.0.0 - Desktop's image banner blurred Shopify Discussion troubleshooting	12	96	October 5, 2023
Why is my Dawn theme desktop banner appearing blurry? Technical Q&A	9	64	September 22, 2022
Dawn theme - desktop image banner is blurry Shopify Discussion troubleshooting	7	125	October 5, 2023
Dawn theme 11.0.0 (latest version) - Desktop's image banner is blurred Shopify Discussion troubleshooting	0	23	September 27, 2023

Why is my Dawn theme banner image blurry and how can I fix it?

Related topics