tuanphan 9,546 Share Posted January 7, 2020 (edited) If you want to use custom font for Navigation, just copy - paste the following codes. Add code to Home > Design > Custom CSS 92 Templates Navigation Link Color - Hover - Active Color Avenue @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav nav ul li a { font-family: your-font-name; } Aviator @font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; } Bedford Template Family Include: Anya, Bedford, Bryant, Hayden, Bedford @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; } Brine Template Family Include: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; } Farro Include: Farro, Haute @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; } Five @font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; } Flatiron @font-face { font-family: your-font-name; src: url(enter your font name url here); } ul#nav li a { font-family: your-font-name; } Forte @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a span { font-family: your-font-name; } Ishimoto @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav #nav li a { font-family: your-font-name; } Momentum @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; } Montauk Template Family Include: Julia, Kent, Montauk, OM @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; } Native @font-face { font-family: your-font-name; src: url(enter your font name url here); } #navBlock ul li a { font-family: your-font-name; } Pacific Template Family Include: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; } Skye Template Family Include: Foundry, Indigo, Ready, Skye, Tudor @font-face { font-family: your-font-name; src: url(enter your font name url here); } .nav-blocks-wrapper div a span { font-family: your-font-name; } Tremont Template Family Include: Camino, Carson, Henson, Tremont @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a span { font-family: your-font-name; } Wells @font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; } Wexley @font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; } York Template Family Include: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York @font-face { font-family: your-font-name; src: url(enter your font name url here); } .site-navigation div a span { font-family: your-font-name; } Squarespace 7.1 Include: Novo, Pazari, Nolan, Utica, Cami, Matsuya, Nevins, Kester, Gates, Zion, Classon, Hawley, Suhama, Elliott, Otto, Tepito, Balboa, Beaumont, Quincy, Talva, Minetta, Falodu, Hester, Crosby, Ventura, Maru, Tresoire, Almar, Alameda, Patil, Stanton, Paloma, Fillmore, Palmera, Souto, Brower, Merida, Grove, Harman, Rivoli, Noll, Bergen, Degraw, Corrigan, Sackett, Lakshi, Pulaski, Suhama, Cailles, Colima, Barbosa, Clune, Irving, Suffolk, Clarkson, Lusaka, Bailard, Malone, Roseti, Euclid, Carmine, Wycoff, Harbor, Ocotillo, Fayette, Roseti, Dario, Soria, Morena, Rey, Lenoix, Bleecker, Vandam, Cruz, Kitui, Waverly, Vance, Orina, Chotto, Auburn, Juniper, Palmer, Atlantic, Iduma, Pine, Eldridge, Pulsaki, Amal, Suhama, Hart, Carroll, Noll, Hidano, Palermo, Cailles, Archer, Kearny, Sellwood, Essex, Mason, Gramercy Studio, Cole, Devoe, Randi, Zorayda, Manor Studios, Grant, Toledo, Hoyd, Troutman, Tantillo, Maqueda, Hemlock, Bogart, Florence @font-face { font-family: your-font-name; src: url(enter your font name url here); } .header-nav *, .header-menu-nav * { font-family: your-font-name; } Made by Tuan Edited May 27, 2020 by tuanphan update ss 7.1 class name kasper.arlund 1 Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 paudub 0 Share Posted January 16, 2020 Hi. I am using Lusaka, and it did not work for me. Why could that be? I have used CSS to change the font of h1,h2, h3,h3 and p to Overpass, but Navigation still has the template font. I used the following code, but it didnt work. @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item a { font-family: your-font-name; } Link to post
0 tuanphan 9,546 Author Share Posted January 16, 2020 55 minutes ago, paudub said: Hi. I am using Lusaka, and it did not work for me. Why could that be? I have used CSS to change the font of h1,h2, h3,h3 and p to Overpass, but Navigation still has the template font. I used the following code, but it didnt work. @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item a { font-family: your-font-name; } try font-family: your-font-name !important; Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 Sofiaelisa 0 Share Posted January 30, 2020 Hi! I'm using "Almar" and this does not work for me either, I have manged to change the fonts for H1 H2 & H3, but not the navigation or the Buttons.. @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item a { font-family: your-font-name; } Link to post
0 Mlekoman 0 Share Posted March 11, 2020 On 1/7/2020 at 11:55 PM, tuanphan said: Squarespace 7.1 Include: Novo, Pazari, Nolan, Utica, Cami, Matsuya, Nevins, Kester, Gates, Zion, Classon, Hawley, Suhama, Elliott, Otto, Tepito, Balboa, Beaumont, Quincy, Talva, Minetta, Falodu, Hester, Crosby, Ventura, Maru, Tresoire, Almar, Alameda, Patil, Stanton, Paloma, Fillmore, Palmera, Souto, Brower, Merida, Grove, Harman, Rivoli, Noll, Bergen, Degraw, Corrigan, Sackett, Lakshi, Pulaski, Suhama, Cailles, Colima, Barbosa, Clune, Irving, Suffolk, Clarkson, Lusaka, Bailard, Malone, Roseti, Euclid, Carmine, Wycoff, Harbor, Ocotillo, Fayette, Roseti, Dario, Soria, Morena, Rey, Lenoix, Bleecker, Vandam, Cruz, Kitui, Waverly, Vance, Orina, Chotto, Auburn, Juniper, Palmer, Atlantic, Iduma, Pine, Eldridge, Pulsaki, Amal, Suhama, Hart, Carroll, Noll, Hidano, Palermo, Cailles, Archer, Kearny, Sellwood, Essex, Mason, Gramercy Studio, Cole, Devoe, Randi, Zorayda, Manor Studios, Grant, Toledo, Hoyd, Troutman, Tantillo, Maqueda, Hemlock, Bogart, Florence @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item a { font-family: your-font-name; } Made by Tuan Hi, I have a Nolan template and unfortunatelly it does not work. Link to my website: studio-kruh-test.squarespace.com Pass: studiokruh Link to post
0 ThitiratMy 1 Share Posted April 13, 2020 WORKED! For MÉRIDA Template .header-nav-item a {font-family: your-font-name; font-size: 10px; line-height: 2px; letter-spacing: 2px; text-shadow:1px 1px black; text-align: justify; text-align-last:initial; } Link to post
0 CornflowersandCalico 0 Share Posted May 7, 2020 Hi, I have the Mason template and i've tried all of the suggested codes, but nothing seems to work at all. Please help. www.cornflowersandcalico.com Link to post
0 tuanphan 9,546 Author Share Posted May 7, 2020 45 minutes ago, CornflowersandCalico said: Add to Home > Design > Custom CSS .header-nav * { font-family: fantasy; } klotz 1 Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 joeljeff 23 Share Posted May 25, 2020 On 3/11/2020 at 5:51 PM, Mlekoman said: Hi, I have a Juniper template and unfortunately it does not work. I've tried everything and with the additional changes suggested to !important and a> * Link to post
0 tuanphan 9,546 Author Share Posted May 27, 2020 On 5/25/2020 at 10:17 PM, joeljeff said: SS 7.1 updated navigation class name. Use this CSS @font-face { font-family: your-font-name; src: url(enter your font name url here); } .header-nav *, .header-menu-nav * { font-family: your-font-name; } Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 Sfortin 0 Share Posted June 15, 2020 Hey there - I have the Paloma template - I have managed to change the navigation and fonts throughout the site but the site description or title in the navigation will not update. Is there specific code for that. Please and thanks! Link to post
Question
tuanphan 9,546
If you want to use custom font for Navigation, just copy - paste the following codes.
Add code to Home > Design > Custom CSS
Avenue
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav nav ul li a { font-family: your-font-name; }
Aviator
@font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; }
Bedford Template Family
Include: Anya, Bedford, Bryant, Hayden, Bedford
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; }
Brine Template Family
Include: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine.
@font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; }
Farro
Include: Farro, Haute
@font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; }
Five
@font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; }
Flatiron
@font-face { font-family: your-font-name; src: url(enter your font name url here); } ul#nav li a { font-family: your-font-name; }
Forte
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a span { font-family: your-font-name; }
Ishimoto
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav #nav li a { font-family: your-font-name; }
Momentum
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; }
Montauk Template Family
Include: Julia, Kent, Montauk, OM
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; }
Native
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #navBlock ul li a { font-family: your-font-name; }
Pacific Template Family
Include: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; }
Skye Template Family
Include: Foundry, Indigo, Ready, Skye, Tudor
@font-face { font-family: your-font-name; src: url(enter your font name url here); } .nav-blocks-wrapper div a span { font-family: your-font-name; }
Tremont Template Family
Include: Camino, Carson, Henson, Tremont
@font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a span { font-family: your-font-name; }
Wells
@font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; }
Wexley
@font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; }
York Template Family
Include: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York
@font-face { font-family: your-font-name; src: url(enter your font name url here); } .site-navigation div a span { font-family: your-font-name; }
Squarespace 7.1
Include: Novo, Pazari, Nolan, Utica, Cami, Matsuya, Nevins, Kester, Gates, Zion, Classon, Hawley, Suhama, Elliott, Otto, Tepito, Balboa, Beaumont, Quincy, Talva, Minetta, Falodu, Hester, Crosby, Ventura, Maru, Tresoire, Almar, Alameda, Patil, Stanton, Paloma, Fillmore, Palmera, Souto, Brower, Merida, Grove, Harman, Rivoli, Noll, Bergen, Degraw, Corrigan, Sackett, Lakshi, Pulaski, Suhama, Cailles, Colima, Barbosa, Clune, Irving, Suffolk, Clarkson, Lusaka, Bailard, Malone, Roseti, Euclid, Carmine, Wycoff, Harbor, Ocotillo, Fayette, Roseti, Dario, Soria, Morena, Rey, Lenoix, Bleecker, Vandam, Cruz, Kitui, Waverly, Vance, Orina, Chotto, Auburn, Juniper, Palmer, Atlantic, Iduma, Pine, Eldridge, Pulsaki, Amal, Suhama, Hart, Carroll, Noll, Hidano, Palermo, Cailles, Archer, Kearny, Sellwood, Essex, Mason, Gramercy Studio, Cole, Devoe, Randi, Zorayda, Manor Studios, Grant, Toledo, Hoyd, Troutman, Tantillo, Maqueda, Hemlock, Bogart, Florence
@font-face { font-family: your-font-name; src: url(enter your font name url here); } .header-nav *, .header-menu-nav * { font-family: your-font-name; }
Made by Tuan
Edited by tuanphanupdate ss 7.1 class name
Email me if you have need any help (free, of course :-D). Answer within 24 hours.
How to:
-- Yup!
Link to post
Top Posters For This Question
4
1
1
1
Popular Days
May 7
2
Jan 16
2
Apr 13
1
Jan 7
1
Top Posters For This Question
tuanphan 4 posts
paudub 1 post
Sofiaelisa 1 post
Mlekoman 1 post
Popular Days
May 7 2020
2 posts
Jan 16 2020
2 posts
Apr 13 2020
1 post
Jan 7 2020
1 post
Popular Posts
tuanphan
If you want to use custom font for Navigation, just copy - paste the following codes. Add code to Home > Design > Custom CSS 92 Templates Navigation Link Color - Hover - Active Color
tuanphan
Add to Home > Design > Custom CSS .header-nav * { font-family: fantasy; }
10 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment