Transparent announcement bar

[Alurithardd]

I made some changes to make my header go transparent and it worked but the announcement bar is also transparent now, I want help to make the bar black and keep the rest same. Please help,

[Moeed]

Hey @Alurithardd 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[Alurithardd]

Sure, Here is the link https://12747e-3c.myshopify.com/?_ab=0&_fd=0&_sc=1

Thanks in advance

[Moeed]

Hey @Alurithardd 

I'm guessing you shared the URL of the live theme instead of the draft theme. Can you share the preview URL of the draft theme by clicking on "Share Preview" in the bottom when you preview the theme?

Best Regards,

Moeed

[Alurithardd]

My bad https://12747e-3c.myshopify.com/?_ab=0&_fd=0&_sc=1

[Moeed]

Hey @Alurithardd 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.announcement-bar__message {
    background: black !important;
}
</style>

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Alurithardd]

Its making the background of text only black 

[Alurithardd]

same result

[Alurithardd]

Thank you, but I cant see those assets, for reference I'm using referesh theme

[PageFly-Richard · Accepted solution]

This is Richard from PageFly - Shopify Page Builder App

Hi @Alurithardd  Please add code here to fix it:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid
Step 3: Add code above the tag </body>

<style>
.shopify-section-group-header-group.announcement-bar-section{
   height: 40px !important;
}
.announcement-bar-section .color-scheme-4 {
  background: black !important;

}

</style>

Hope my solution will help you resolve the issue.

Best regards,

Richard | PageFly