Jump to content

Header Customization on 7.1

Recommended Posts

Site URL: https://kumquat-heron-mxwk.squarespace.com/config/

Hi there,

I would like to know a few things about the headers on 7.1 and its css codes

1. How do I assign an alternate color to the drop down menu only (ie: keeping the bacground white on the header, but a different color on the menu only)

2. Where is it that I can assign a different color to Navigation links that are active in the header menu? I can't seem to find it

3. When choosing to center the site logo with the menu (under Header options), the menu continues on a second row. Is there a way to assign code wherein the entire menu can be on one line?

 

Thats it for now,

Thanks so much

Sandy

Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

1. Add to Home > Design > Custom CSS

.header-nav-folder-content {
    background: red !important;
}

2. Add to Home > Design > Custom CSS

.header-nav-item--active a {
    color: red !important;
}
/* for dropdown active */
.header-nav-folder-item.header-nav-folder-item--active a {
    color: red !important;
}

3. You want to center logo - menu?

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

3. You want to center logo - menu?

Yes 🙂

One more question though is the active navigation wjen clicked on has been applied (thank you :))

but when I just hover over the drop down menu items it doesn't turn to the color I'd like, only when its clicked on

would you know the css in that case?

 

Many thanks

Sandy

Link to comment

but when I just hover over the drop down menu items it doesn't turn to the color I'd like, only when its clicked on

.header-nav-item:hover>a {
    color: red !important;
}
.header-nav-folder-item:hover a {
    color: red !important;
}

Center logo/site title

 

You mean on desktop or mobile?

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.