Logo losing quality when I put it on Shopify

When I place my logo on my logo it seems like the image is blurry, I’m making it at a size of 600x200 px and saving the file as svg, the loss of quality happens mainly on the computer, could someone help me with this? the theme used is the dawn theme, but edited by third parties

My website address is: https://lpofertas.com/

Hi @LuccaCornelio35 ,

I checked and it shows fine, is dawn theme not published yet?

Yes, it has already been published, the theme I use is danw

Hi @LuccaCornelio35 ,

Please send me the code of header.liquid file, I will check it for you

{% if section.settings.menu.links == blank %}
{% assign main_menu_linklist = linklists[section.settings.menu].links %}
{% else %}
{% assign main_menu_linklist = section.settings.menu.links %}
{% endif %}

{% render 'icon-menu' , color: section.settings.color_text_alignment %}
{% render 'icon-search', color: section.settings.color_text_alignment %} {% if section.settings.show_cart %}
{% render 'icon-shopping-bag', color: section.settings.color_text_alignment %}
{% endif %}
{% if section.settings.menu.links == blank %} {% assign main_menu_linklist = linklists[section.settings.menu].links %} {% else %} {% assign main_menu_linklist = section.settings.menu.links %} {% endif %} {% for link in main_menu_linklist %} {% if link.links != blank %} {% assign link_handle = link.handle | replace: '-', '_' %}
{{ link.title }} {% render 'icon-dropdown' %}
{% for childlink in link.links %}

{{ childlink.title }}

{% endfor %}
{% else %} {{ link.title }} {% endif %} {% endfor %}
{% if shop.customer_accounts_enabled %} {% if customer %} Conta {{ 'Sair' | customer_logout_link | replace: '<a', '<a class="text-black menu-black font-semibold p-2 opacity-100 text-small hover:bg-purple-50 hover:rounded-md"' }} {% else %} {% if section.settings.show_login %} {% render 'icon-login',color: section.settings.color_text_alignment %} {% endif %} {% if section.settings.show_account %} {% if section.settings.color_text_alignment == 'escuro' %} {{ 'Cadastre-se' | customer_register_link | replace: '<a', '<a class="text-black menu-black font-semibold p-2 opacity-100 text-small hover:bg-purple-50 hover:rounded-md"' }} {% else %} {{ 'Cadastre-se' | customer_register_link | replace: '<a', '<a class="text-white menu-white font-semibold p-2 opacity-100 text-small hover:bg-purple-50 hover:rounded-md"' }} {% endif %} {% endif %} {% endif %} {% endif %} {% render 'icon-search', color: section.settings.color_text_alignment %}

{% if section.settings.show_cart %}

{% render ‘icon-shopping-bag’, color: section.settings.color_text_alignment %}

{% endif %}

{% render 'icon-close' , color: section.settings.color_text_alignment %}
{% if section.settings.menu.links == blank %} {% assign main_menu_linklist = linklists[section.settings.menu].links %} {% else %} {% assign main_menu_linklist = section.settings.menu.links %} {% endif %} {% for link in main_menu_linklist %} {% if link.links != blank %} {% assign mobile_link_handle = link.handle | replace: '-', '_' %}
{{ link.title }}
{% render 'icon-dropdown' %}
{% for childlink in link.links %} {{ childlink.title }} {% endfor %}
{% else %} {{ link.title }} {% endif %} {% endfor %}
{% if cart != empty %}

{{ 'general.dropsmart.cart.title_cart' | t }}

{% render 'icon-close', color: "#000" %}

{{ 'general.dropsmart.cart.product' | t }}

{{ 'general.dropsmart.cart.total' | t }}

{% comment %} {% for item in cart.items %}
{{ 'products.product.quantity.label' | t }} {{ 'products.product.quantity.increase' | t: product: item.product.title | escape }} {% render 'icon-minus', color: section.settings.color_title_alignment %} {{ 'products.product.quantity.increase' | t: product: item.product.title | escape }} {% render 'icon-plus' %}
{%- if item.original_line_price != item.final_line_price -%}
{{ 'products.product.price.regular_price' | t }}
{{ item.original_line_price | money }}
{{ 'products.product.price.sale_price' | t }}
{{ item.final_line_price | money }}
{%- else -%} {{ item.original_line_price | money }} {%- endif -%} {%- if item.variant.available and item.unit_price_measurement -%}
{{ 'products.product.price.unit_price' | t }} {{ item.variant.unit_price | money }} /  {{ 'accessibility.unit_price_separator' | t }}  {%- if item.variant.unit_price_measurement.reference_value != 1 -%} {{- item.variant.unit_price_measurement.reference_value -}} {%- endif -%} {{ item.variant.unit_price_measurement.reference_unit }}
{%- endif -%}
{% endfor %} {% endcomment %}

{{ 'general.dropsmart.cart.subtotal' | t }}: {{ cart.total_price | money }}

Ir para o Carrinho {{ 'general.dropsmart.cart.button_name' | t }}
{% if section.settings.show_taxes %} {{ 'general.dropsmart.cart.info' | t }} {% endif %}

{{ 'accessibility.loading' | t }}

{% else %}

{{ section.settings.title_cart | t}}

{% render 'empty-cart' %}

{{ 'general.dropsmart.cart.empty_cart' | t }}

{% if section.settings.show_button %} {% endif %}
{% endif %}
{% render 'icon-search-active', color: settings.primary_color %}
{% render 'icon-close', color: section.settings.color_text_alignment %}

{% schema %}
{
“name”: “t:settings_schema.dropsmart.header.name”,
“settings”: [
{
“type”: “image_picker”,
“id”: “logo”,
“label”: “t:settings_schema.dropsmart.header.settings.logo”,
“info” : “t:settings_schema.dropsmart.general.sizes.600”
},
{
“type”: “link_list”,
“id”: “menu”,
“default”: “main-menu”,
“label”: “t:settings_schema.dropsmart.header.settings.menu”
},
{
“type”: “header”,
“content”: “t:settings_schema.dropsmart.header.settings.options”
},
{
“type”: “checkbox”,
“id”: “show_header”,
“default”: true,
“label”: “t:settings_schema.dropsmart.header.settings.show_header”
},
{
“type”: “checkbox”,
“id”: “show_login”,
“default”: false,
“label”: “t:settings_schema.dropsmart.header.settings.show_login”
},
{
“type”: “checkbox”,
“id”: “show_account”,
“default”: false,
“label”: “t:settings_schema.dropsmart.header.settings.show_account”
},
{
“type”: “checkbox”,
“id”: “show_cart”,
“default”: true,
“label”: “t:settings_schema.dropsmart.header.settings.show_cart”
},
{
“type”: “checkbox”,
“id”: “show_return_page”,
“default”: true,
“label”: “t:settings_schema.dropsmart.header.settings.show_return_page”
},
{
“type”: “header”,
“content”: “t:settings_schema.dropsmart.header.settings.header_appearance”
},
{
“type”: “select”,
“id”: “color_text_alignment”,
“label”: “t:settings_schema.dropsmart.general.title_description”,
“options”: [
{
“value”: “escuro”,
“label”: “t:settings_schema.dropsmart.general.black”
},
{
“value”: “claro”,
“label”: “t:settings_schema.dropsmart.general.clean”
}
],
“default”: “escuro”
},
{
“type”: “color”,
“id”: “background_color”,
“default”: “#ffffff”,
“label”: “t:settings_schema.dropsmart.general.background-color”
}
]
}
{% endschema %}
{% style %}
.m-header{
box-shadow: 0px -22px 80px rgba(0, 0, 0, 0.08), 0px -5.61409px 17.869px rgba(0, 0, 0, 0.0476886), 0px -1.83393px 5.32008px rgba(0, 0, 0, 0.0323114);
}
.icon-menu-open{
position: relative;
top: -70px;
left: -17px;
background-color:{{ section.settings.background_color }}
}
.menu-open{
margin-top: 60px;
}
.menu-open-padding{
margin-top: -60px;
}
.menu-black:hover{
color: {{ settings.primary_color }}
}
.menu-white:hover{
color: #fff;
background: rgba(255, 255, 255, 0.05);
}
.menu-white.active{
color: #ffffff;
background: rgba(255, 255, 255, 0.05);
}
.active{
color: {{ settings.primary_color }}
}
.box-cart{
box-shadow: 0px -22px 80px rgba(0, 0, 0, 0.08), 0px -5.61409px 17.869px rgba(0, 0, 0, 0.0476886), 0px -1.83393px 5.32008px rgba(0, 0, 0, 0.0323114);
}
{% endstyle %}

Hi @LuccaCornelio35 ,

Please change code here:

Code:

{{ section.settings.logo | image_url: width: section.settings.logo.width | image_tag: loading: 'lazy', class: 'w-full h-full max-h-[48px] object-cover ' }}

Apparently, even after the changes, the logo still has a lower quality than that shown on mobile devices.

Hi @LuccaCornelio35 ,

Can I send you a collaborator invitation? It will help me double check everything.

Yes, you can, absolutely.

Hi @LuccaCornelio35 ,

please send me the collaborator code in private message, I will send it to you