Need Help With Theme Header - Simple Theme

[Arman_Misdar]

Hi Guys, I have no idea on how to change the header in theme called "Simple". I prefer my logo (or banner) to be spread 100% over the page width instead of left position (default).

The default left position on logo placement creating awkward and unnecessary empty spaces on top of the featured banner.

Thanks in advance for your help!

[Savannah_F]

Hey, Arman!

Savannah here from the Shopify Social Care Team. :) 

• Navigate to Online Store>Themes and select Edit Code on Simple 
• In the Assets folder of your theme files, select the theme.scss. 
• Change width and height of your logo to 100%, like this. You can find those controls by doing a Control + F search for

.site-header__logo

Once you've done that, scroll to the very bottom of the theme.scss and paste this code:

#HeaderLogoWrapper{
  margin:auto;
} 

That should do the trick! Let me know if you have any trouble along the way. 

Savannah | Social Care
support@shopify.com
 

[Arman_Misdar]

Thanks Savannah, I really appreciate your help. It seems to work, but there's a gap at the top and bottom area that I would like to reduce, perhaps this is called padding, but I'm not sure which line of code shall I modify.

You can refer to the attachment to see what I mean.

Thanks again :-)

[Savannah_F]

Hi again!

So that padding actually has to do with the header heigh. You can control it by reducing the number here. 

Let me know if that works out!

Savannah | Social Care
support@shopify.com

[Arman_Misdar]

Awesome! Thank you Savannah, its working as intended now. Have a nice day!

[Steven_Wildey]

where exactly can i find this in the code?

[Steven_Wildey]

i found it and reduced it but is having no effect as ypu can see:

[Steven_Wildey]

i wish to keep my logo where it is - left hand side and close the gap on the header.

[Savannah_F]

Hey, Steven!

I'm afraid that's a bit too complex for me to solve. That said, you can certainly have our theme team take care of that for you as a part of 60 minutes of design time (as per our design policy). Simply email us at support@shopify.com we a clear explanation of your request. You'll receive a support ticket number in reply, and if you send that along here, I'd be happy to escalate the request for you in order to expediate the process.

Have a great day,

Savannah | Social Care
support@shopify.com

[weburu]

Hi, I was searching on how to have a logo banner, i came across this forum, my logo banner is now across the page, which is great, however when I open the site on a mobile phone the banner is significantly smaller, in fact too small, how can I fix the mobile display size banner?

---

@Savannah_F wrote:

Hey, Steven!

I'm afraid that's a bit too complex for me to solve. That said, you can certainly have our theme team take care of that for you as a part of 60 minutes of design time (as per our design policy). Simply email us at support@shopify.com we a clear explanation of your request. You'll receive a support ticket number in reply, and if you send that along here, I'd be happy to escalate the request for you in order to expediate the process.

Have a great day,

Savannah | Social Care
support@shopify.com

---