FROM CACHE - en_header

Supply Theme - Help with mobile header

D2
Tourist
10 0 3

Hi everyone,

I'm having difficulties changing the height of only the mobile header. Everything that I try changes both the main and mobile headers. The mobile header is too tall. If anyone has a fix for this, I'd be grateful. 

mobile header too tall.PNG

Thanks in advance!

 

Replies 18 (18)
KetanKumar
Shopify Partner
35842 3584 11596

Hello, @D2 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
D2
Tourist
10 0 3

Thanks for the welcome!

I just sent you a PM with the pass.

KetanKumar
Shopify Partner
35842 3584 11596

@D2 

Thanks for Store URL.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media screen and (max-width: 768px) {
.header-logo .lazyload__image-wrapper {
    margin: 0 auto;
}
.grid-item.large--one-half.text-center.large--text-right {
    display: none;
}
}

 

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
D2
Tourist
10 0 3

Hi Ketan,

That reduced the height by a couple of pixels so we're defiantly on the right path, thank you.  What would I change to reduce the height even more?

KetanKumar
Shopify Partner
35842 3584 11596

@D2 

Thanks for update

yes your have remove unnecessary logo image black spacing 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Webmasterpro
Tourist
3 0 2

I removed the death space from my logo however it is still taking up 1/4 of the screen. Any way to further reduce the size?

KetanKumar
Shopify Partner
35842 3584 11596

Hello, @Webmasterpro 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Webmasterpro
Tourist
3 0 2
KetanKumar
Shopify Partner
35842 3584 11596

@Webmasterpro 

Thanks for the store URL.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.site-header {
padding-top: 5px;

.site-header--text-links, p {
margin-bottom: 0;
}

}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Webmasterpro
Tourist
3 0 2

Worked gr8! Thanks

KetanKumar
Shopify Partner
35842 3584 11596

@Webmasterpro 

Thanks for the update and support.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
periorstudios
Tourist
3 0 3

@KetanKumar 

I hope you are well. I followed all the steps described but it is not working for me unfortunately. Can you please take a look at my code if I did it right:

 

2021-05-17_11-17-22.jpg

 

Many Thanks

Tom

KetanKumar
Shopify Partner
35842 3584 11596

@periorstudios 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

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

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
periorstudios
Tourist
3 0 3

Hi @KetanKumar 

 

I sent you the site log in details in a direct message!

 

Many Thanks for looking into it!

KR

Tom

 

 

KetanKumar
Shopify Partner
35842 3584 11596

@periorstudios 

ok thanks i will check and let you know 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
35842 3584 11596

@periorstudios 

please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media screen and (max-width: 768px) {.header-logo {margin: 0px auto -40px;}}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
periorstudios
Tourist
3 0 3

@KetanKumar 

It worked wonderfully!

Many many thanks!  🙂

 

 

KetanKumar
Shopify Partner
35842 3584 11596

@periorstudios 

it's my pleasure to help us

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing