I have tried everything and can’t center annoucement bar on my theme.
I added code to theme, to announcement bar liquid. My css theme file shows it is centered
Topic summary
Issue: Announcement bar text won’t center. Theme edits were attempted in the announcement-bar liquid and CSS; the theme’s CSS indicated centered alignment, but the visible result wasn’t centered.
Early guidance was vague (“add code multiple times before the announcement bar text”), leading to confusion about what code to add and where (HTML vs theme customization). Attempts did not work.
Access provided for troubleshooting: the store URL and password were shared so a developer could inspect.
Proposed fix: Edit Online Store > Themes > Edit code > Assets > base.css and add a CSS snippet under a desktop-only media query (min-width: 992px) targeting .announcement-bar__link with flex: 1 and margin-left: 200px. A screenshot was included. The shared snippet appears to contain syntax issues in the @media line and braces, and the approach may shift rather than truly center the text.
Latest update: After the update, the homepage layout became “messed up.” A revert was requested.
Status: Unresolved. Pending revert and a corrected, safe centering method; no final solution confirmed.
1 Like
Hello, itx_Alee Shopify Store Designer. Please add this code multiple times until you find right before announcement bar text ** **
let me know if this isn’t work Thanks
What code?
Add it into html code or directly into the bar theme customization bar? Not working
Hello There,
Please share your store URL and password.
So that I will check and let you know the exact solution here.
homeofficedesks
tmtyler@eatel.net
Pixiepup1
1 Like
Hello there,
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset > base.css and paste this at the bottom of the file:
@media screen and (min-width: 992px)
.announcement-bar__link {
flex: 1;
margin-left: 200px;
}
}
Something if off. It shows someone updated my theme, but home page is messed up. Please revert.