Personalized checkout and custom promotions with Shopify Scripts
Hey guys i edit the announcement bar in my base.css
How can i get the announcement bar up?
It blocks the icons 😞
I use this code:
.announcement-bar {
background-color: #263644!important;
float: left;
width: 100%;
position: fixed
}
Thanks
Solved! Go to the solution
This is an accepted solution.
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >base.css and paste this at the bottom of the file:
@media only screen and (max-width: 990px){
header.header.header--middle-left.page-width.header--has-menu {
padding-top: 3%;
}
p.announcement-bar__message.h5 {
padding: 1%;
}
}
@media only screen and (max-width: 769px){
header.header.header--middle-left.page-width.header--has-menu {
padding-top: 7%;
}
p.announcement-bar__message.h5 {
padding: 1%;
}
}
Screenshot :- https://prnt.sc/itrvZoDyzOko
This is an accepted solution.
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >base.css and paste this at the bottom of the file:
@media only screen and (max-width: 990px){
header.header.header--middle-left.page-width.header--has-menu {
padding-top: 3%;
}
p.announcement-bar__message.h5 {
padding: 1%;
}
}
@media only screen and (max-width: 769px){
header.header.header--middle-left.page-width.header--has-menu {
padding-top: 7%;
}
p.announcement-bar__message.h5 {
padding: 1%;
}
}
Screenshot :- https://prnt.sc/itrvZoDyzOko
Thank u its work!
Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025