Shopify themes, liquid, logos, and UX
This is the shop name on mobile, I want WABISABI on the upper line and MART under it. Can anyone help please? Thanks
Solved! Go to the solution
This is an accepted solution.
Hi @geeza1
Your header is very narrow in terms of spacing, you would need to ideally remove one element or reduce the size of the logo immensely using this code:
@media only screen and (max-width: 749px)
{
#shopify-section-header > div:nth-child(3) > header > div > div.grid__item.medium-up--one-quarter.logo-align--left > h1 > a {
font-size: 12px;
}
}
Should that help answer your query, we always appreciate liking & marking an as answer to let the community find quality solutions faster. Thanks!
This is an accepted solution.
svg.icon.icon-search {
display: none !important;
}
@geeza1
Add this code in the Theme.scss or theme.css
Welcome to the Shopify community!
Thanks for your good question.
Please share your store URL.
So that I will check and let you know the exact solution here.
Please share your store URL!
Thanks!
Please share your site URL,
I will check out the issue and provide you a solution here.
This is an accepted solution.
Hi @geeza1
Your header is very narrow in terms of spacing, you would need to ideally remove one element or reduce the size of the logo immensely using this code:
@media only screen and (max-width: 749px)
{
#shopify-section-header > div:nth-child(3) > header > div > div.grid__item.medium-up--one-quarter.logo-align--left > h1 > a {
font-size: 12px;
}
}
Should that help answer your query, we always appreciate liking & marking an as answer to let the community find quality solutions faster. Thanks!
HI many thanks, I wondering if I can hide the search element it might help. Can I do this with code?
thanks for your help
Yes possible, use the following code at the end of your theme.css file:
@media only screen and (max-width: 749px)
{
button.btn--link.site-header__icon.site-header__search-toggle.js-drawer-open-top {
display: none;
}
}
Let me know if that works instead!
This is an accepted solution.
svg.icon.icon-search {
display: none !important;
}
@geeza1
Add this code in the Theme.scss or theme.css
Where do i put this code?
thansk
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024