Jump to content

Custom Font doesn't load

Go to solution Solved by tuanphan,

Recommended Posts

3 hours ago, ruthob93 said:

Thank you Paul, on this occasion I actually managed to resolve the issue.

In case it is useful to anyone - I got it working by removing all the relevant CSS, deleting the files, re-uploading the files and re-introducing the CSS.

It seems I spoke too soon - My Heading 1 font is not loading on Mobile, only desktop, but the others are ok. It DOES load in the Squarespace editor mobile mode, but not on actual mobiles. My site is provenancespiritsgroup.com. I would greatly appreciate if anyone can help! I've never had this issue with Squarespace custom fonts before. I'm guessing there's a glitch with Squarespace?

Link to comment
On 9/26/2022 at 8:49 PM, ruthob93 said:

Hi Venera! Is there any chance you could share exactly what you did to make it work? Did you rename the font file on you computer and re-upload?

What is your site url? We can help easier

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 9/28/2022 at 4:53 PM, ruthob93 said:

@tuanphan Thanks! It's provenancespiritsgroup.com

I have managed to get the fonts loading on desktop but not mobile. Squarespace editor shows them loading on mobile version, but on actual mobile phones it doesn't load!

Thanks in advance for your help 😁

Screenshot_2022-09-28-11-52-55-44_40deb401b9ffe8e1df2f1cc5ba480b12.jpg

Font file url in your code doesn't exist. You try checking again

(Do you use Trial Plan? Sometime, uploaded file won't work on trial)

https://static1.squarespace.com/static/5f7f1b3695baee1b6d038760/t/632084187177b03cc891a297/1663075353118/Milkstore05-Rough.ttf

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
5 hours ago, tuanphan said:

Font file url in your code doesn't exist. You try checking again

(Do you use Trial Plan? Sometime, uploaded file won't work on trial)

https://static1.squarespace.com/static/5f7f1b3695baee1b6d038760/t/632084187177b03cc891a297/1663075353118/Milkstore05-Rough.ttf

@tuanphan Thank you so much! When I read your message I realised that while solving the original issue with the custom fonts I re-linked it incorrectly! 😅 Thank you so much - I thought I was losing my mind but all fixed now! Cheers!

Link to comment
  • 1 month later...

Hi all, 

Need help with this, I downloaded this free font but it's not working.  I've uploaded it (see screenshot attached) and I think I've put in the correct code in CSS?

Any help would be greatly appreciated, thanks!

@font-face {
  font-family: 'Chopper';
  src: url('https://static1.squarespace.com/static/5cc581ebd7819e7af1cc6782/t/63765487a5f98f0b63b4a4ef/1668699271792/Chopper.ttf');
}

Screenshot 2022-11-17 at 16.49.57.png

Link to comment
On 11/17/2022 at 10:52 PM, NBM said:

Hi all, 

Need help with this, I downloaded this free font but it's not working.  I've uploaded it (see screenshot attached) and I think I've put in the correct code in CSS?

Any help would be greatly appreciated, thanks!

@font-face {
  font-family: 'Chopper';
  src: url('https://static1.squarespace.com/static/5cc581ebd7819e7af1cc6782/t/63765487a5f98f0b63b4a4ef/1668699271792/Chopper.ttf');
}

Screenshot 2022-11-17 at 16.49.57.png

Have you assigned font for elements yet? Eg if you want to assign font for h2, after declaring font-face, you need to add this code under

h2 {font-family: 'Chopper' !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

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.