showcase theme header full width

Hankthetank
New Member
5 0 0

Hello,

I am trying to get the header full page width "go out of screen". As now the banner color leaves 5mm space on each side. How can do this in Showcase theme?

Replies 9 (9)

Moeed
Shopify Partner
3542 892 1107

Hey @Hankthetank 

 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Canva to Shopify in clicks - Free App
Hankthetank
New Member
5 0 0

Why would I share my password with you?

Moeed
Shopify Partner
3542 892 1107

Because I need to have a look at your website so that I can provide you the solution.

 

Best Regards,

Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Canva to Shopify in clicks - Free App
Hankthetank
New Member
5 0 0

Thanks but no thanks. I do not share my password here.

PageFly-Oliver
Globetrotter
701 138 131

Hi @Hankthetank ,

 

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

 

<style>
.container{
max-width:100% !important;
width:100% !important
}
</style>

 

 

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Hankthetank
New Member
5 0 0

Thanks a lot 🙂

Will the CSS changes the public store when I change in draft mode? I don't wanna mess things up.

Moeed
Shopify Partner
3542 892 1107

The above code given by @PageFly-Oliver will not only target your header but will also target every section of your website which may cause every section to be max-width so before you use the above code, be careful just letting you know.

 

Best Regards,

Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Canva to Shopify in clicks - Free App
Hankthetank
New Member
5 0 0

Hello Moeed and @PageFly-Oliver ,

Ok so how do I know what's the correct solution? 

Can I test this CSS code in Shopify draft mode without disturbing our page which is currently LIVE?

 

Many thanks

PageFly-Oliver
Globetrotter
701 138 131

You can try it on the theme draft. it won't affect the live view

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.