Hello,
we use Empire and would like to adjust the announcement bar there.
At the moment it is not possible to show a space between the words.
What do I have to change to make this possible?
Best wishes
Katharina Keilbach
Topic summary
A user running the Empire Shopify theme needs help adjusting spacing in the announcement bar to improve text readability.
Solutions Proposed:
-
oscprofessional suggested adding CSS code to
theme.scss.liquid(Assets > Edit code):- First attempt:
word-spacing: 10px;for screens 720px+ wide - Second attempt:
letter-spacing: 2px;for the announcement bar
- First attempt:
-
GemPages recommended editing the
theme.liquidfile and pasting code before</head>to increase letter and word spacing
Current Status:
The user reported that at least one solution didn’t work. The discussion appears ongoing, with no confirmed resolution yet. The issue involves CSS modifications to control text spacing in the announcement bar component.
@KCK22 ,
@media screen and (min-width: 720px){
.announcement-bar-text {
word-spacing: 10px;
}
}
Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid
Hello @KCK22
I would like to give you some recommendations to support you.
To increase the space between letters and words on your announcement bar. Make text easier to read and look better.
You can follow:
- Go to Online Store → Theme → Edit code
- Open your theme.liquid theme file
- Paste the below code before
Hope my recommendation can works and support for you!
Best regards,
GemPages Support Team
unfortunately this does not work.
unfortunately this does not work.
@KCK22
Hello,
.announcement-bar {
letter-spacing: 2px;
}
Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid
Like This
