How can I make the header transparent in Debut theme?

Solved
LuxeDerma
Tourist
4 0 3

Hi there,

We're working on updating our store to a new theme and have selected the Debut template to work from. Currently we use Brooklyn for our live site and if the top section of the homepage is a slideshow we're able to make the header transparent so that our logo and nav. menu are overlaid on the slideshow, however I can't seem to figure out how to do it in the Debut theme. Is this possible? Is it something I can do in the online editor or would it require special code?

Thank you!

paramSoft
Shopify Partner
1662 260 724


Please provide website url and if your store is password protected then also provide password

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
KetanKumar
Shopify Partner
16096 1771 5942

@LuxeDerma 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
LuxeDerma
Tourist
4 0 3

The url is www.luxederma.ca.

Thank you!

0 Likes
KetanKumar
Shopify Partner
16096 1771 5942

@LuxeDerma 

Thanks for url but i need debut theme your store url

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
LuxeDerma
Tourist
4 0 3

Sorry about that, I forgot it's still in editing mode. Here's the template preview url: https://luxe-derma-partners.myshopify.com/?fts=0&preview_theme_id=81029038124

Thanks!

KetanKumar
Shopify Partner
16096 1771 5942

This is an accepted solution.

@LuxeDerma 

Thanks for update

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

.template-index .site-header {background-color: transparent; position: absolute;}
.template-index .site-header__mobile-nav {background-color: transparent;}

 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
nicoleram
New Member
2 0 2

How can I make it so that when I scroll down it stays at the top and it has a white background?

 

Like in this website:

https://fubu.com/

 

KetanKumar
Shopify Partner
16096 1771 5942

@nicoleram 

Sorry for facing this issue, it's my pleasure to help us.

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
nicoleram
New Member
2 0 2