Jump to content

Customizing nav banner size

Go to solution Solved by tuanphan,

Recommended Posts

  • Replies 10
  • Created
  • Last Reply

Top Posters In This Topic

11 hours ago, hudson_lee02 said:

Ideally, just a white background that isn't too thick so it doesn't take up too much space. It would be nice if it stayed visible with scrolling through the page but I don't care too much about that.

Hi. Like this?

likethis2.thumb.png.2c1cd48c5ba01de5b9c95274f212d8c0.png

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

I remember it should be an option in Site Styles.

Add to Design > Custom CSS
 

body.homepage header#header {
    background-color: white !important;
}
body.homepage header#header .header-nav-item a {
    color: black;
}
body.homepage header#header .burger-inner>div {
    background-color: black;
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
On 6/14/2022 at 2:50 AM, tuanphan said:

I remember it should be an option in Site Styles.

Add to Design > Custom CSS
 

body.homepage header#header {
    background-color: white !important;
}
body.homepage header#header .header-nav-item a {
    color: black;
}
body.homepage header#header .burger-inner>div {
    background-color: black;
}

 

This looks and is working great, but is only appearing on the homepage. How do I make this site wide and stay the exact same?

Link to comment
9 hours ago, hudson_lee02 said:

This looks and is working great, but is only appearing on the homepage. How do I make this site wide and stay the exact same?

remove body.homepage in the code

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
On 6/14/2022 at 2:50 AM, tuanphan said:

I remember it should be an option in Site Styles.

Add to Design > Custom CSS
 

body.homepage header#header {
    background-color: white !important;
}
body.homepage header#header .header-nav-item a {
    color: black;
}
body.homepage header#header .burger-inner>div {
    background-color: black;
}

How do I make the banner stay visible when you scroll through the page?

Link to comment
  • Solution
7 hours ago, hudson_lee02 said:
On 6/14/2022 at 3:50 PM, tuanphan said:

I remember it should be an option in Site Styles.

Add to Design > Custom CSS
 

body.homepage header#header {
    background-color: white !important;
}
body.homepage header#header .header-nav-item a {
    color: black;
}
body.homepage header#header .burger-inner>div {
    background-color: black;
}

How do I make the banner stay visible when you scroll through the page?

Edit Site Header > Fixed

siteheader.thumb.png.13e93924acd1bc48a4f8214ae85493c8.png

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.