Change Header Logo Size (Make Smaller)

WingateA
New Member
2 0 0

Hello!

 

I have posted my logo into the theme builder and it is REALLY large taking up over half of the header.  I tried making a smaller logo in pixels and while it did make it smaller, it made the logo grainy.

 

How can I modify the code to adjust the logo size?

 

https://wingate-apothecary.myshopify.com/

 

Thank you!

Ps.  In my searching of the boards and threads, I did see this code quite a bit and gave it a try, but it did not work.

Pasted at the bottom of Assets>theme.scss.liquid

.site-header__logo-image {
max-width: 310px;
}
.site-header__logo-image img {
width: 125%;
max-width: 310px !important;
}

0 Likes
florinanghel
Shopify Partner
102 15 17

The storefront is password protected.

0 Likes
WingateA
New Member
2 0 0
OH! Sorry...

clewgu
0 Likes

add the max-width property to the class .normal-logo instead:

 

.normal-logo {
  max-width: 150px;
}

 

Alter the number accordingly to get the maximum size that you want your logo to be. Just be mindful of people with larger screens, you don't want to make it look tiny on their screen! 

www.mcleancreative.co.uk
0 Likes