Bar covers page content
Fix a bar that overlaps your header, menu, cart drawer, or other elements.
The bar covers your navigation or a dropdown
Open the announcement and go to the Design tab.
In Positioning, try switching Position from Top Page to Bottom Page.
Click Save and check your storefront.
Moving the bar solves most overlap problems, because they're usually caused by a sticky theme header.
The bar is hidden behind your header
Go to the Content tab.
Click Show Advanced Settings.
Increase the Z-Index value.
Click Save and check your storefront.
The bar covers a modal or cart drawer
Open Show Advanced Settings on the Content tab.
Decrease the Z-Index value so the modal sits above the bar.
Click Save and test opening the modal or cart drawer.
See Advanced settings (Z-Index).
The sticky bar takes too much room on mobile
Go to Design → Typography.
Set a smaller Mobile size for the title and subheading.
Shorten the title text so it fits on one line.
Click Save.
If it's still too tall, untick Sticky bar in Positioning so the bar scrolls away with the page.
Change z-index in large steps — try 999 or 99999, not 2147484. Nudging by 1 rarely changes which element wins.
Tip
Test with your cart drawer open and your mobile menu expanded. Those are the two elements a bar most often collides with, and both are easy to miss when you're only looking at the home page.