Transparent Sticky header on scroll up only

Shopify Discussion
1

Hey guys!
I need help, i made my header transparent on my home page and i want it to sticky on scroll up, when i put “on scroll up” settings it becomes sticky always!

2

Hi @Drews1k ,

If you want to create a transparent sticky header on scroll, follow these steps:

  1. Go to Online Store → Themes → Edit Code
  2. Search for the file base.css
  3. Paste the code at the bottom of the file
.scrolled-past-header .header-wrapper{
  background-color: transparent !important;
}

Note: This scenario works only with the Dawn theme.

3

Doesn’t work for me, i’m using Sense theme, maybe i can share my url with you and you can check it? I need sticky header “on scroll on” on my home page

4

Please share the URL of the website.

5

https://f35b35-f9.myshopify.com/

Pass- 2633

6

Can you also help me with transparent header and announcement bat?

7

If your sense theme here follows the steps above:

  1. Go to Online Store → Themes → Customize.
  2. Go to Header, find the Sticky Header option, select “Always,” reduce the logo size, and save.

Untitled.png
Untitled.png1910×915 217 KB

3. Go to Online Store → Themes → Edit Code.

  1. Search for the file base.css.

  2. Paste the code at the bottom of the file.

.scrolled-past-header .header-wrapper{
  background-color: transparent !important;
}​
8

Sure, for further assistance, please reach out to us at info@devmontdigital.io.