Solved

Debut Theme, Shop Name Spacing/ Sizing Issue

geeza1
Tourist
4 0 2

Screen Shot 2022-02-14 at 13.55.23.png

This is the shop name on mobile, I want WABISABI on the upper line and MART under it. Can anyone help please? Thanks

Accepted Solutions (2)

JHKCreate
Shopify Expert
3571 639 917

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!

 

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com

View solution in original post

Zworthkey
Shopify Partner
5581 642 1567

This is an accepted solution.

svg.icon.icon-search {
    display: none !important;
}

@geeza1 
Add this code in the Theme.scss or theme.css

View solution in original post

Replies 9 (9)

Zworthkey
Shopify Partner
5581 642 1567

@geeza1 

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.

geeza1
Tourist
4 0 2

Many thanks for your help

 

https://www.lostjapanstore.com/

 

password protected with "lost2506"

dmwwebartisan
Shopify Partner
12289 2547 3698

@geeza1 

Please share your store URL!

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

infoatcodelab7
Shopify Partner
593 141 145

@geeza1 

Please share your site URL,
I will check out the issue and provide you a solution here.

Want to modify or develop new website, Hire us.
If helpful then please Like and Accept Solution .
Email: info@codelab7.com

JHKCreate
Shopify Expert
3571 639 917

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!

 

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
geeza1
Tourist
4 0 2

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

JHKCreate
Shopify Expert
3571 639 917

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!

 

 

Did we solve your issue? Like & Mark As Solution to help the community
Should you need any direct help: contact@jhkcreate.com

Learn more about us: jhkcreate.com
Zworthkey
Shopify Partner
5581 642 1567

This is an accepted solution.

svg.icon.icon-search {
    display: none !important;
}

@geeza1 
Add this code in the Theme.scss or theme.css

geeza1
Tourist
4 0 2

Where do i put this code?

thansk