How do i edit my annoucement bar fonts sizes ?

[Aaron_Toh]

How do I amend my announcement bar's font sizes and which .liquid i should head to. I have no knowledge about css but a simple step explanation could help me alot. Thank you.

[Lixon_Louis]

Use this code at the very bottom of theme.scss.liquid (inside Assets)

.announcement-bar__message{ font-size: 18px}

[Aaron_Toh]

Thanks it helps! Another question, how do i probably change the fonts and also bold the fonts. Would you be able to advise me on this as well ? Thank you.

[Churidan]

Hey Aaron, been a long time since you posted this question but since no one answered I thought I would now.

To make it bold:

.announcement-bar__message{ font-size: 12px; font-weight: bold}

To change the font (say Arial in this example):

.announcement-bar__message{ font-size: 12px; font-weight: bold; font-family: Arial, Helvetica, sans-serif;}

[RevolutionNow]

This doesn't work on my Supply theme.

revolutionary-t-shirts.com

Would be grateful for any advice, also on removing padding on header and footer. Thanks and regards

Steve

[John1118]

Same here, it does'nt work. Is there a way this could work? Thanks.

[Jordan1990]

Works when changing the font size, but how do I change the width of the actual bar?

[Dannielfranics]

it works on the mobile view but there are some glitches or crosses along the webpage when in desktop view. can you help?

[paramashop]

I also have the same question. How to change bar width?

[MatthewS]

He always help me. Recommend.

https://www.fiverr.com/share/L3Gm9p

[ecordier]

Any idea why my font size is not changing after adding this code? I'm using Impulse

[Ferguson]

Hi can you please tell me where exactly to add this.

Thanks !!

{% endcomment %}

{% if section.settings.show_announcement %}
<div class="header-bar__module header-bar__message>
{% if section.settings.announcement_link != blank %}
<a href="{{ section.settings.announcement_link }}">
{% endif %}
{{ section.settings.header_text | escape }}

{% if section.settings.announcement_link != blank %}
</a>

{% endif %}

[AussieQBBQ]

Doesnt seem to work on the Venue theme either.