code scrolling announcement bar

Store Design
, , , , , , , , , , , , , , ,
1

hi guys! would someone help me give me the code for the grey (scrolling) ad bar present on this site under the black menu?

https://oliviamoreau.de/

2

This creates a scrolling grey announcement bar (marquee-style) below the main menu:

FREE SHIPPING ON ORDERS OVER $50 — NEW COLLECTION JUST DROPPED — SIGN UP FOR 10% OFF —
@keyframes scroll-left { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

Instructions:

You can place this code below your navigation bar in theme.liquid or header.liquid.

Replace the text inside the with your own ad messages.

3

Hello @matthewdropship

  1. From your Shopify Admin, navigate to Online Store > Themes > Edit Code
  2. In the Assets folder, open base.css and add your CSS code at the end
.section-sections--24711802061125__ss_announcement_bar_slideshow_fXAAqw-settings {
background: gray;
}

devcoders_0-1746969077438.png
devcoders_0-1746969077438.png1341×446 262 KB

4

thanks for the help guys! If you notice in the website the words don’t scroll as in the code here but on the site the sentence stays still and then scrolls after a number of seconds, how can I get that effect?