How can I place a moving announcement bar under the header?

Store Design
1

hello, can someone give me the code to have a moving announcement bar under the header like the site i linked below. thank you !!

https://4lkclothing.com/

2

Hi @ExoticSouls .

Can you send me the link to the store URL and password, so I can help you.

I’m Richard Nguyen from PageFly- Free Landing Page Builder

Hope this answer helps.

Best regards,

Richard | PageFly

3

https://exoticsouls.world/

my password is EXOTICFAMILY1

4

Hi @ExoticSouls .

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can go to Online store => themes => actions => edit code and add this code on file base.css

@media screen and (min-width: 1200px){
div#shopify-section-announcement-bar{
position: relative;
top: 210px;
}
.header-wrapper.color-background-1.gradient {
Bottom: 40px;
}
}

Hope this answer helps.

Best regards,

Richard | PageFly

5

i pasted that code at the bottom of base.css and its not showing up, any idea why?

Image 11-7-22 at 9.23 PM.jpeg
Image 11-7-22 at 9.23 PM.jpeg3456×2074 303 KB

6

you can try this code

@media screen and (min-width: 1200px){ 
div#shopify-section-announcement-bar{ 
position: relative !important; 
top: 210px !important ; 
} 
.header-wrapper.color-background-1.gradient { 
bottom: 40px !important; 
} 
}
7

still not working, it’s still giving me the regular announcement bar

8

Hi @ExoticSouls .

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can go to Online store => themes => actions => edit code and add this code on file theme.liquid above tag

Hope this answer helps.

Best regards,

Richard | PageFly