We are trying to delete the yellow covid announcement banner/bar on top of the header. We cant seem to see any option on the settings. Thank you
Topic summary
A user needs to remove a yellow COVID announcement banner appearing at the top of their Shopify store header. The banner is visible in a provided screenshot but has no removal option in the standard settings.
Proposed Solutions:
Three community members offered CSS-based fixes:
-
Solution 1: Add CSS code to the theme.css file (Assets folder) to hide the banner using
display: noneon the specific header element -
Solution 2: Reference to a detailed guide in another community thread addressing the same COVID banner issue
-
Solution 3: Insert custom CSS within a
<style>tag in the theme.liquid file before the</head>tag, with a screenshot showing the expected result
All approaches involve editing theme code files rather than using built-in Shopify settings. The issue remains open as the original poster hasn’t confirmed which solution worked.
Hi @KarlosPena ,
Please go to Actions > Edit code > Assets > theme.css file and paste this at the bottom of the file:
#header .row.mob-header>div:first-child {
display: none;
}
Hi @KarlosPena
Please follow up the case from this post: https://community.shopify.com/c/shopify-design/covid-banner-announcement-on-top-of-the-page/td-p/2902370
I have already shared the detail guide for you ![]()
- Here is the solution for you @KarlosPena
- Please follow these steps:
- Go to Online Store → Theme → Edit code.
- Open your theme.liquid file
- In theme.liquid, paste the below code before and press ‘Save’ to save it
- This is the result you will get:
- Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

