Status bar colour - how to change the background colour?

Hi,

My site is Harkandzander.com The orange background on the apple status bar is not very nice - we would like to change the colour but can’t find any help anywhere with how to do this. We are using the Impulse theme. Only seems to be on latest apple phones. Can anyone help? preferable we want white background with the blue writing like the rest of the page.

@Widget

.announcement-bar{background-color: #f2f2f2;}

for this, you need to add the above CSS on the theme.css file

Merchants that need to buy this customization may contact me with this topic url, store url and theme name.

That would be theme-colors

https://developers.google.com/web/updates/2014/11/Support-for-theme-color-in-Chrome-39-for-Android

https://webkit.org/blog/11989/new-webkit-features-in-safari-15/

Which is part of adding a site a mobile devices homepage

https://developers.google.com/web/fundamentals/design-and-ux/browser-customization

Your site is using #fb4f14 which seems to be the themes strong accent or call to action color (add to cart buttons,etc)

Always backup themes and files before making changes

It’s basically this line a theme.liquid , or head.liquid ,etc depending on theme.


1 Like

@NileshTejani Thanks for helping me trouble shoot. I put that on the theme.liquid but nothing changed.

Wouldnt the annoucement bar be the limegreen bar that we have promotions in? Having said that - that didnt change either but I can change that lime green bar through the theme easily

##- Please type your reply above this line -
Could you give me store url

Sure thing @NileshTejani

its using the impulse theme.

@Widget
Add this code in theme.css or theme.scss

.announcement-bar {
    background-color: white !important;
}

@Widget

.announcement-bar {
    background-color: #eaf5c5!important;
}

add this css

Thanks @PaulNewton everyone else was talking about the annoucement bar. You nailed it with this helpful post. In the end I used

This has sorted things out nicely

Thanks everyone!

1 Like

Hi @Widget ,

I’m glad you were able to find a solution that works for you! Thank you @PaulNewton for sharing your solution.

Hey @PaulNewton would you be able to help me here as well? I have a white bar on safari but my theme is black. I’ve tried adding the code but it doesn’t seem to make a difference. Really ppreciate the help! :slightly_smiling_face:

Hey man can you also help me with the same issue?