Jump to content

Trouble Changing the Header Font with Custom CSS, Need Help!

Recommended Posts

Site URL: https://www.isolatedtogetherpodcast.org/

I've been spinning my wheels on this for hours. I've successfully loaded a custom font and it's working for most text boxes. But I can't find the code to alter the header font. I'm using the Paloma template, with Squarespace version 7.1  (though squarespace doesn't seem to recognize the template for some reason). 

I also can't edit the summary block of my episodes on the homepage. They're arranged in a carousel, and the font is correct on the actual episode page, but it reverts to the default font for the summary block. 

So two things: 

  1. How do I change the header font; and
  2. How do I change the font in the summary block/carousel?

Here are some of the codes i've tried that haven't worked: 

nav {font-family: 'TIMES';}

header {font-family: 'TIMES';}

header-nav-item {font-family: 'TIMES';}

header-element {font-family: 'TIMES';}

header-nav {font-family: 'TIMES';}

header-nav-list {font-family: 'TIMES';}

header-menu-nav-item {font-family: 'TIMES';}

container header-menu-nav-item {font-family: 'TIMES';}

container header {font-family: 'TIMES';}

header-menu {font-family: 'TIMES';}

header-menu--folder-list {font-family: 'TIMES';}

sqs-block-content {font-family: 'TIMES';}

sqs-block {font-family: 'TIMES';}

#page-header nav ul a {font-family: 'TIMES' !important;}

 

.desc-wrapper { font-family:'TIMES';  }

#mainNavigation a { font-family: 'TIMES';  }
#headerNav nav a {
 font-family: 'TIMES' !important;}
.desc-wrapper p > strong {
 font-family: 'TIMES' !important;}

 

None of these have worked! Please help! Thanks so much.

Link to comment
  • Replies 5
  • Created
  • Last Reply

Top Posters In This Topic

15 hours ago, daveroch said:

UPDATE: I found the code to change the header: 

.header-nav-item a {
  font-family: 'TIMES' !important;
}

But I still haven't been able to fix the font in the summary box carousel. Any ideas?

Add to Home > design > Custom CSS

time.summary-metadata-item.summary-metadata-item--date {
    font-family: 'TIMES' !important;
}
a.summary-title-link {
    font-family: 'TIMES' !important;
}
a.summary-read-more-link {
    font-family: 'TIMES' !important;
}

 

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
On 4/9/2020 at 2:02 AM, daveroch said:

It worked! Thank you @tuanphan! I just realized that on mobile, the navigation bar font is still the default font. I've tried a lot of different CSS code and none have worked. Any ideas?

Mobile nav items use this class

nav.header-menu-nav-list a {
    font-family: 'TIMES' !important;
}

 

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
  • 2 years later...

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.