Hello,
I am San from MS Web Designer.
Go to Themes > Edit code > Theme.liquid > at the bottom place this code before
Do let me know in case of any concerns.
Regards,
San
Topic summary
Goal: make mobile hero text fit on one line and center the announcement bar text (“30 day growing guarantee”).
Proposed CSS-based approaches (mobile-only via media queries):
- Adjust hero title size: examples suggest max-width ~749–767px and font-size around 27–31px targeting selectors like .m-hero__content .m-hero__title.h2 or h3 within .m-hero__inner…
- Force single-line titles where needed: add white-space: nowrap (shown for product card titles) and use a responsive font-size (e.g., 4vw) to scale on small screens.
- Center announcement bar: apply .m-announcement-bar__link { text-align: center; } within a mobile media query.
Where to place code varies:
- In theme.liquid inside within a block.
- Before in theme.liquid.
- At the end of Assets/base.css.
Notes:
- Multiple screenshots illustrate where to edit code and the mobile result.
- Two replies appear to reference adding code but include empty code blocks.
Status: no confirmation from the original poster; solution not yet marked. The key open item is selecting the correct selector(s) for the store’s theme and confirming the change resolves both the one-line fit and centered announcement text on mobile.