Shopify themes, liquid, logos, and UX
I have the new version of dawn version 5.0 and I was following this tutorial https://community.shopify.com/c/shopify-design/dawn-2-0-theme-logo-size/m-p/1347238#M352342 to increase my logo size but the instruction given was:
To fix the issue of the logo resolution, you can change the settings in header.liquid.
Assuming you want to change the image size to 350, you can do the following:
{%- assign image_size = section.settings.logo_width | append: 'x' -%}
to be changed to
{%- assign image_size = 350 | append: 'x' -%}
I think the reason why I cannot locate the code on my header.liquid is because the code in version 5.0 is different. Any thoughts on how to get my logo increase its size on dawn version 5.0 would be appreicated.
To learn more visit the Shopify Help Center or the Community Blog.
Solved! Go to the solution
This is an accepted solution.
Hi,
Well, you can use the logo size slider in the admin GUI to set it up to 250 (while in customise, on the home page, with the header section selected). If you want it bigger than that, then find this section in the header.liquid, in the bottom "schema" section:
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 10,
"default": 100,
"unit": "t:sections.header.settings.logo_width.unit",
"label": "t:sections.header.settings.logo_width.label"
},
... and change the max to 350 or 500, or whatever you would like. Then you can just set it through the GUI, rather than hardcoding a value somewhere, which probably isn't best practice.
Hope that does it.
Kevin.
This is an accepted solution.
Hi,
Well, you can use the logo size slider in the admin GUI to set it up to 250 (while in customise, on the home page, with the header section selected). If you want it bigger than that, then find this section in the header.liquid, in the bottom "schema" section:
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 10,
"default": 100,
"unit": "t:sections.header.settings.logo_width.unit",
"label": "t:sections.header.settings.logo_width.label"
},
... and change the max to 350 or 500, or whatever you would like. Then you can just set it through the GUI, rather than hardcoding a value somewhere, which probably isn't best practice.
Hope that does it.
Kevin.
Thank you Kevin. You really helped me a lot.
To learn more visit the Shopify Help Center or the Community Blog.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025