Jump to content

Background color on mobile (top and bottom)

Recommended Posts

  • Replies 11
  • Views 4k
  • Created
  • Last Reply

Top Posters In This Topic

20 minutes ago, geirwerner said:

When I open the page...it shows a blue color on top  (where the notch is on an iPhone)

The body background colour is currently set to #0000f0 [blue] causing Safari 15 to set the header to this colour too. You should be able to set this in the Theme Editor (see https://support.squarespace.com/hc/en-us/articles/205815788-Making-style-changes).

1604187751_Screenshot2021-11-01at19_13_46.png.534b86a9405cdb0560130b656aa1bdab.png

1661535401_Screenshot2021-11-01at19_15_09.thumb.png.420b40885c2d46aef2fa8a623d4ab259.png

 

If you can't find this setting, adding the following meta tag to Settings > Advanced > Code Injection > HEADER should force the header to be white:

<meta name="theme-color" content="#fff">

  If this post has helped you, please click a 'Like' or 'Thanks' icon below  ⬇️

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment
On 11/2/2021 at 3:41 AM, geirwerner said:

Thanks, Paul It worked on top, but is still blue in the bottom. (on mobile at least). Can´t find a reason for that blue color to arrive...  🤔

 

Edit: Well now I saw, the css for the body...

Hi,

have you solved it yet & still need help?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 weeks later...
1 hour ago, erikabarichello said:

How can I achieve this?

To troubleshoot this, we'll need a working link to the site. Can you share the URL with us please? 

Also, if the site isn't live, please set a password in the visibility settings and tell us what it is.

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment

It appears to be working for me:

1222002526_Screenshot2021-11-20at19_25_52.thumb.png.32830b884281bddeeeb50d301bce5318.png

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment

I can't explain why it's not working for you, but I'm seeing it on all devices 🙂

IMG_A14F919E528A-1.jpeg.6252f061b33c7bf8060df11ba4c4cbdf.jpeg

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment
  • 1 year later...

Hiya! Old thread, I realize- but I've found the actual vanilla config for this.

In your color themes, find the primary one that your site is treating as a default (when you go to add a new section, it's probably the one that Squarespace is picking for you by default).

Find the Background option and change this to the color you would like your Safari mobile top and bottom to be:

Screenshot 2023-07-16 at 19-52-28 Services — Broome & Co.png

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.