Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

7.1 NAV CUSTOM FONT CSS


Question

Site URL: https://www.sunrisehomestead.com/

Hey ya'll- hitting a wall here.

Earlier I uploaded a custom font, did the css, and applied it to all the H categories I wanted. The whole site is dialed in with my custom font exactly where I want it EXCEPT I cant for the life of me figure out the CSS to get my Navigation links to convert to my new custom font.  "About, Projects, Contact" for both standard and mobile views.

I did a ton of research both on this forum and via google and tried everything under the sun that I could find and those navigation links just would not change to my custom font. 

Can anyone give me a hand here and help me out with the CSS Code to make this happen for both my standard and mobile site?

 

REALLY REALLY APPRECIATE IT GUYS!

SUNRISEHOMESTEAD.COM

 

Nick

 

 

Link to post
  • Answers 8
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Add to Home > Design > Custom CSS .header-nav *, nav.header-menu-nav-list * { font-family: yourfont; }  

Posted Images

8 answers to this question

Recommended Posts

  • 0

@tuanphan I always love your answers but on this occasion, I cannot get it to work for me.

I uploaded a custom font and here's the end of the code. (The first bit is repeated above for each font weight). All the H1- H4 and P work but I cannot get the nav or title to change. Can you help? Site is www.systemsandsmiles.com.

@font-face {    
    font-family: 'SUPERNETT CONDENSED LIGHT ITALIC';       
        src: url('https://static1.squarespace.com/static/5f6b5b2a0674315a2fc2157f/t/5f6b6891344f544bfdbb9158/1600874647517/FaceType+-+Supernett+Condensed+Light+Italic.otf');  
}

h1 {font-family: 'SUPERNETT CONDENSED BOLD ITALIC';}
h2 {font-family: 'SUPERNETT REGULAR';}
h3 {font-family: 'SUPERNETT LIGHT';}
h4 {font-family: 'SUPERNETT CONDENSED REGULAR';}
P {font-family: 'SUPERNETT REGULAR';}

/* Custom Font - Site Title */

.logo.site-title a {
   font-family: 'SUPERNETT REGULAR' !important;
}


/* Font Nav */
div #topNav a {
  font-family: 'SUPERNETT REGULAR' !important; }

Edited by sixmileshigh
typos
Link to post
  • 0
29 minutes ago, sixmileshigh said:

@tuanphan I always love your answers but on this occasion, I cannot get it to work for me.

I uploaded a custom font and here's the end of the code. (The first bit is repeated above for each font weight). All the H1- H4 and P work but I cannot get the nav or title to change. Can you help? Site is www.systemsandsmiles.com.

@font-face {    
    font-family: 'SUPERNETT CONDENSED LIGHT ITALIC';       
        src: url('https://static1.squarespace.com/static/5f6b5b2a0674315a2fc2157f/t/5f6b6891344f544bfdbb9158/1600874647517/FaceType+-+Supernett+Condensed+Light+Italic.otf');  
}

h1 {font-family: 'SUPERNETT CONDENSED BOLD ITALIC';}
h2 {font-family: 'SUPERNETT REGULAR';}
h3 {font-family: 'SUPERNETT LIGHT';}
h4 {font-family: 'SUPERNETT CONDENSED REGULAR';}
P {font-family: 'SUPERNETT REGULAR';}

/* Custom Font - Site Title */

.logo.site-title a {
   font-family: 'SUPERNETT REGULAR' !important;
}


/* Font Nav */
div #topNav a {
  font-family: 'SUPERNETT REGULAR' !important; }

#topNav is not class in SS 7.1.

nav.header-menu-nav-list * {
   font-family: 'SUPERNETT REGULAR' !important;
}

 

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- Pour your heart into it

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...