Jump to content

Custom Font Not Working

Recommended Posts

Site URL: https://www.careerspace.co.nz/

Hi, custom font is not working. This is not my area of expertise and would really appreciate some advice on what is missing. Here is the code. Many thanks in advance!

 

@font-face {

  font-family:'kiona-light'

    src url ('https://static1.squarespace.com/static/61636f178ba836289e08a2d5/t/616394b321324671f8c2283e/1633916083358/FontsFree-Net-Kiona-Light.ttf')

}

h1,h2, h3, h4, h5 {

  font-family:'kiona-light'

}

p1 {

  font-family:'kiona-light'

}

Link to comment

You made some mistake in the code. Remove previous code and add this code Design > Custom CSS

@font-face {
  font-family: 'kiona-light';
  src: url(https://static1.squarespace.com/static/61636f178ba836289e08a2d5/t/616394b321324671f8c2283e/1633916083358/FontsFree-Net-Kiona-Light.ttf);
}

h1, h2, h3, h4, h5 {
  font-family:'kiona-light';
}
p {
  font-family: 'kiona-light';
}

 

Link to comment
12 hours ago, HollyR said:

Site URL: https://www.careerspace.co.nz/

Hi, custom font is not working. This is not my area of expertise and would really appreciate some advice on what is missing. Here is the code. Many thanks in advance!

 

@font-face {

  font-family:'kiona-light'

    src url ('https://static1.squarespace.com/static/61636f178ba836289e08a2d5/t/616394b321324671f8c2283e/1633916083358/FontsFree-Net-Kiona-Light.ttf')

}

h1,h2, h3, h4, h5 {

  font-family:'kiona-light'

}

p1 {

  font-family:'kiona-light'

}

Hi, it might be due to an error in the format of your code. Try this instead and let me know how it goes 🙂 

@font-face {
  font-family: 'Kiona-Light';
  src: url('https://static1.squarespace.com/static/61636f178ba836289e08a2d5/t/616394b321324671f8c2283e/1633916083358/FontsFree-Net-Kiona-Light.ttf'')  format('truetype');
}

Please give this a 👍 if it helps

Link to comment

Hi there, apologies I have realised since that I have missed out some important information in my question. Heading 1 needs to be Kiona and Headings 2, 3 & 4 need to be Kiona Light. Heading 5 doesnt appear to feature in my site. The other important piece of information is that all paragraph font (paragraph 1, 2 & 3) is a different font: Poppins font. Poppins is listed as the font under site styles. So the custom font needs to be such that it doesnt over-ride the current paragraph Poppins font. Hope that makes sense and many thanks in advance, I really appreciate the help on this!

Link to comment
On 4/19/2022 at 4:14 AM, HollyR said:

Hi there, apologies I have realised since that I have missed out some important information in my question. Heading 1 needs to be Kiona and Headings 2, 3 & 4 need to be Kiona Light. Heading 5 doesnt appear to feature in my site. The other important piece of information is that all paragraph font (paragraph 1, 2 & 3) is a different font: Poppins font. Poppins is listed as the font under site styles. So the custom font needs to be such that it doesnt over-ride the current paragraph Poppins font. Hope that makes sense and many thanks in advance, I really appreciate the help on this!

Did you solve or still need help?

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
  • 2 weeks later...
  • 1 year later...

Hi mine is not working either. 😞

I can see the fonts on my desktop but not on my mobile.

here's the code"

font-face {
font-family: 'PPAcma-Thin';
src: url('https://static1.squarespace.com/static/6453eeaf6bf01e2085369aac/t/6453efaff08986661a2ba075/1683222448128/PPAcma-Thin.otf');
}

h1 {
font-family: 'PPAcma-Thin';
letter-spacing: -8px;
}

 

here's the site:

maim.ai

 

thanks

 

Link to comment
  • 4 weeks later...

Hi, 

 

Mine is not working too. Can you check if I did the codes correctly?

@font-face {
font-family: 'Daydream';
src: url('https://static1.squarespace.com/static/64636e3a78a5397f8f328335/t/647793d6c5f56e76a43d1168/1685558230404/daydream+FREE.ttf');
}
  h1 {
font-family: 'Daydream';

}

Link to comment
On 6/1/2023 at 2:49 AM, Sheena1995 said:

Hi, 

 

Mine is not working too. Can you check if I did the codes correctly?

@font-face {
font-family: 'Daydream';
src: url('https://static1.squarespace.com/static/64636e3a78a5397f8f328335/t/647793d6c5f56e76a43d1168/1685558230404/daydream+FREE.ttf');
}
  h1 {
font-family: 'Daydream';

}

What is your site url?

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

Mine is not working either! Any help?

---------------------------------------------------------

@font-face {
font-family: AvenirLTStd-Book;
src: url(https://static1.squarespace.com/static/64679645254756010b7379ff/t/6467f4b2a01df3421a44ddff/1684534450492/AvenirLTStd-Book.otf);
}

@font-face {
font-family: News Gothic Regular;
src: url(https://static1.squarespace.com/static/64679645254756010b7379ff/t/6467f4bfb16c233bb713ea35/1684534463663/News+Gothic+Regular.otf);
}

h1 {
font-family: 'AvenirLTStd-Book';
}

h2 {
font-family: 'AvenirLTStd-Book';
}

h3 {
font-family: 'AvenirLTStd-Book';
}

h4 {
font-family: 'AvenirLTStd-Book';
}

.sqsrte-large {
font-family: 'News Gothic Regular';
}

p {
font-family: 'News Gothic Regular';
}

.sqsrte-small {
font-family: 'News Gothic Regular';
}
 

Link to comment
On 6/3/2023 at 6:37 AM, 1to3go said:

Mine is not working either! Any help?

---------------------------------------------------------

@font-face {
font-family: AvenirLTStd-Book;
src: url(https://static1.squarespace.com/static/64679645254756010b7379ff/t/6467f4b2a01df3421a44ddff/1684534450492/AvenirLTStd-Book.otf);
}

@font-face {
font-family: News Gothic Regular;
src: url(https://static1.squarespace.com/static/64679645254756010b7379ff/t/6467f4bfb16c233bb713ea35/1684534463663/News+Gothic+Regular.otf);
}

h1 {
font-family: 'AvenirLTStd-Book';
}

h2 {
font-family: 'AvenirLTStd-Book';
}

h3 {
font-family: 'AvenirLTStd-Book';
}

h4 {
font-family: 'AvenirLTStd-Book';
}

.sqsrte-large {
font-family: 'News Gothic Regular';
}

p {
font-family: 'News Gothic Regular';
}

.sqsrte-small {
font-family: 'News Gothic Regular';
}
 

The code looks correct. What is site url? We can check easier

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.