I want to change the heights, font sizes, and font colors of my two announcement bars separately. How would I do this?
website is https://836057-a3.myshopify.com/?_ab=0&_fd=0&_sc=1
password is theeti
Topic summary
Goal: adjust the two Shopify announcement bars independently (heights, font sizes, and colors), and specifically set the first bar to 50px height and the second to 30px.
What was provided: a helper outlined where to add custom code (Shopify Admin > Online Store > Theme > Edit code > theme.liquid, insert code before ). An image was referenced as a result preview.
What’s missing: the actual CSS/markup snippet is not included in the replies, so there is no concrete selector or code to implement the separate styles. The image and code are central to execution but not present in the thread text.
Current status: unresolved. The original poster’s follow-up request for explicit heights (50px first bar, 30px second) remains unanswered with actionable CSS. Next concrete step needed is a working CSS example that targets each announcement bar separately (e.g., distinct selectors for bar 1 vs. bar 2) with font size/color and height declarations.
1 Like
Hi @robotcolleecter ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above tag:
Here is result:
Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 
how would i make it so that the height of the first bar is 50px and the second is 30px?
1 Like
Hi @robotcolleecter ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above tag:
Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you