Shopify themes, liquid, logos, and UX
To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more
I finally decided to replace the blurred .png logo with a vector based one on our site.
It seems nice on the desktop but on mobile devices the logo looks terrible. The font does not seem to be loaded correctly in the svg file and the entire logo looks compressed.
On desktop it looks fine:
On mobile device it looks awful:
This is what I have done:
1. Uploaded a .svg-logo to assets.
2. Edited the code as follows
In the header.liquid I removed this code...
<img src="{{ section.settings.logo | img_url: image_size }}" srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x" alt="{{ section.settings.logo.alt | default: shop.name }}" itemprop="logo">
and replaced with this magic...
<p><a href=""><img src="https://cdn.shopify.com/s/files/1/0412/8843/3815/files/logo.svg?v=1634737206" alt="" style="display: block; margin-left: auto; margin-right: auto;" /></a></p>
Venture theme
Are there any tips on how to tweak this so the logo looks okey on the mobile as well?
Thanks.
User | RANK |
---|---|
126 | |
95 | |
78 | |
54 | |
46 |
Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022Shipping can be one of the most vital parts to set up and manage your business. Understand...
By Ollie Dec 16, 2022