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!

HardikDavra
Shopify Partner
2328 367 1003


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

PageFly Landing Page Builder - #1 Choice For Responsive, SEO-friendly Landing, Product Page.

For fast Communication: Email: parambabla.soft@gmail.com | Whatsapp
KetanKumar
Shopify Partner
20524 2121 7738

@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 Partner | 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
20524 2121 7738

@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 Partner | 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
20524 2121 7738

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 Partner | 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
20524 2121 7738

@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 Partner | 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