Solved

Can I resize the header in my custom theme on Shopify?

elyra
Tourist
9 0 3

Hi 

 

Im wanting my make my header small but haven't found an answer.

 

website is elyra.com.au

 

I also have uploaded my own theme. Thanks!

Accepted Solution (1)

ZestardTech
Shopify Expert
5393 970 1291

This is an accepted solution.

Hello There,

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

 

#header.header6 .site-header .middle-header-content .middle-header-wrapper .site-header__logo {
    padding: 5px 10px 0px!important;
}
#header.header6 .site-header .nav-megamenu .site-nav li.level0 > a {
    padding-top: 15px!important;
    padding-bottom: 15px!important;
}

 

Screenshot :- https://prnt.sc/10jjyst

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

View solution in original post

Replies 5 (5)

Zworthkey
Shopify Partner
5581 642 1565

hi, @elyra 

Make your logo height smaller.

Thank you.

elyra
Tourist
9 0 3

@Zworthkey I've done that but it only shrinks the logo while the header remains the same.

ZestardTech
Shopify Expert
5393 970 1291

This is an accepted solution.

Hello There,

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

 

#header.header6 .site-header .middle-header-content .middle-header-wrapper .site-header__logo {
    padding: 5px 10px 0px!important;
}
#header.header6 .site-header .nav-megamenu .site-nav li.level0 > a {
    padding-top: 15px!important;
    padding-bottom: 15px!important;
}

 

Screenshot :- https://prnt.sc/10jjyst

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
elyra
Tourist
9 0 3

@ZestardTech  Thank you so much!

ZestardTech
Shopify Expert
5393 970 1291

Kindly feel free to get back to me if you need any further assistance Thanks!

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing