Custom Fonts Not Working

I'm at wit's end. I'm playing around with a site and cannot for the life of me get the custom fonts to appear. Doesn't matter which  browser I'm using. Where am I going wrong? This isn't the first site I've had issues with custom fonts lately.

https://katyblooms.squarespace.com

password for site is katy

// Custom Header Font //
@font-face {   
  font-family: Promenade-Regular;   
  src: url("https://static1.squarespace.com/static/6391abbbd6796d1f420dc91b/t/63f626ad6dabcc769280af89/1677076141930/Promenade-Regular.woff"); 
  src: url("https://static1.squarespace.com/static/6391abbbd6796d1f420dc91b/t/63f626b19c152d5aa7e4fe4b/1677076145724/Promenade-Regular.woff2"); 
}

h1, h2, h3, h4 { 
  font-family: 'Promenade-Regular' !important; 
}

You have two sources (SRC:) set for the font, that might be causing a conflict, does removing one or the other help?

@Ziggy No 😞 Just tried

20 minutes ago, ShannonPruitt said:

This isn't the first site I've had issues with custom fonts lately.

I've heard the same thing quite a few times recently.

When I view the page it does appear to be loading correctly, are you on a Mac?

@Ziggy yeah.. on a mac

Could you find and test using a .TTF (true type font) file format for the font instead of .woff?

@Ziggy Didn't work 😣 Tried .OTF too...

Where did you get the font from? I'm wondering if there could be an issue with the font file. There's nothing wrong with your upload method and CSS. Could you share it with me so I can run my own tests?

Jen Wagner... attached the .woff font

@Ziggy nvm, it won't attach. can i email it to you?

Having the exact same problem. Pretty sure my CSS is all fine? But fonts not showing up for me

font-face {
font-family: 'JOSTBOLD';
src: url('https://static1.squarespace.com/static/63f62f0c2a8ce83838e369cb/t/63f634513a455825bcf03e16/1677079633807/Jost-Bold.ttf');
}
font-face {
font-family: 'JOSTSEMIBOLD';
src: url('https://static1.squarespace.com/static/63f62f0c2a8ce83838e369cb/t/63f6345f9d91452ffc4842c7/1677079648245/Jost-SemiBold.ttf');
}
font-face {
font-family: 'JOSTMEDIUM';
src: url('https://static1.squarespace.com/static/63f62f0c2a8ce83838e369cb/t/63f6346a32d2915055e85725/1677079659292/Jost-Medium.ttf');
}

h1 {font-family: 'JOSTBOLD';}

h2 {font-family: 'JOSTSEMIBOLD';}

h3 {font-family: 'JOSTSEMIBOLD';}

h4 {font-family: 'JOSTMEDIUM';}

.sqsrte-large {font-family: 'JOSTMEDIUM';}

p {font-family: 'JOSTMEDIUM';}

.sqsrte-small {font-family: 'JOSTMEDIUM';}

1 hour ago, Jessica23 said:

Having the exact same problem. Pretty sure my CSS is all fine? But fonts not showing up for me

font-face {

@Jessica23 Your CSS is wrong.

You are missing the '@' symbol before each 'font-face'. It should be @font-face.

Did this help? Please give feedback by clicking an icon below  ⬇️

2 hours ago, ShannonPruitt said:

I'm playing around with a site and cannot for the life of me get the custom fonts to appear.

@ShannonPruitt When I checked, the font file URLs didn't work. I recommend that you check these files have been uploaded correctly in the Custom CSS panel.

On 2/22/2023 at 6:05 PM, paul2009 said:

@Jessica23 Your CSS is wrong.

You are missing the '@' symbol before each 'font-face'. It should be @font-face.

Did this help? Please give feedback by clicking an icon below  ⬇️

Thank you so so much!!!!! Can't believe I didn't spot that!

So I have the same problem but already checked if it's not one of the upper issues. I did the website probably 2 months ago and the uploaded custom font stopped working while I was fixing other things. Today I decided to give it another chance before changing to something else and I deleted the url and loaded it again from 'select custom files'

The font started working again and it's not just on my side bc I was talking to someone else and there also was working. 4 hours later - the font is no show - tried the same process as earlier - it doesn't work too

website: marianadankova.com

@font-face {
font-family: 'Amely';
src: url('https://static1.squarespace.com/static/641c576fb51b070c95601e4f/t/64c07cdb22745b3f33dcac63/1690336475499/Amely.otf');
}

/* additional styles */
h4 {
font-family: 'Amely';
text-transform: none;
font-weight: 400;
font-style: normal;
text-align: left;
color: #D3BB8F
}

I would appreciate it if someone helps me.

11 hours ago, MarieD said:

So I have the same problem but already checked if it's not one of the upper issues. I did the website probably 2 months ago and the uploaded custom font stopped working while I was fixing other things. Today I decided to give it another chance before changing to something else and I deleted the url and loaded it again from 'select custom files'

The font started working again and it's not just on my side bc I was talking to someone else and there also was working. 4 hours later - the font is no show - tried the same process as earlier - it doesn't work too

website: marianadankova.com

 

@font-face {
font-family: 'Amely';
src: url('https://static1.squarespace.com/static/641c576fb51b070c95601e4f/t/64c07cdb22745b3f33dcac63/1690336475499/Amely.otf');
}

/* additional styles */
h4 {
font-family: 'Amely';
text-transform: none;
font-weight: 400;
font-style: normal;
text-align: left;
color: #D3BB8F
}

I would appreciate it if someone helps me.

found the answer today - !important was missing from the h4

Hey team - same problem here 🥲 Custom fonts displaying fine, until recently - not sure exactly when but I noticed it today. It seems to only be affected H1 and H2. Any help would be incredibly appreciated 🙏

Here's the code I'm using:

@font-face {
  
font-family: 'Summer Loving';

src: url(https://static1.squarespace.com/static/62f3967f3e3ae368609e2ae8/t/64c12dbdc08b6f7d4a6e2955/1690381762943/SummerLoving.otf);
  
}

h1 {
font-family: 'Summer Loving';}

h2 {
font-family: 'Summer Loving';}

// Site Title //
.header-title-text a {
  font-family: 'Summer Loving';
}

To pre-emptively answer some of the Qs from above!

- I bought the font from Creative Market a few years ago this if the first issue I've had!

- I'm on a mac, using Chrome

- I removed, re-uploaded and re-linked the font file but no dice

- I used to have !important in the Site Title section, but removed it as I saw in another forum post that was the issue, but no fix (perhaps I need it in another place?)

Thanks in advance for any wisdom!

Squarespace is making some back-end updates to the fonts and how they are applied, for now you will have to use !important to force them to work:

@font-face {
  font-family: 'Summer Loving';
  src: url(https://static1.squarespace.com/static/62f3967f3e3ae368609e2ae8/t/64c12dbdc08b6f7d4a6e2955/1690381762943/SummerLoving.otf);
}

h1 {
  font-family: 'Summer Loving' !important;
}

h2 {
  font-family: 'Summer Loving' !important;
}

// Site Title //
.header-title-text a {
  font-family: 'Summer Loving' !important;
}

Hi! I'm also having the same issue... the same custom heading font is working fine on another (live) website but I'm having trouble with this on one I'm designing now. The 'fresh styles' text should be H4 in a script font. 

Code below: 

// La Luxes Script upload //
font-face {
font-family: 'LALUXES';
src: url('https://static1.squarespace.com/static/6481c2b9614bdc3272a8d4a5/t/64c171fe084d1343cf9f2a0e/1690399230708/La+Luxes+Script.ttf');
}
h4 {
  font-family: 'LALUXES' !important;
}

url: https://tambourine-alpaca-6xhn.squarespace.com/home-1

password: password

Thank you 

Try adding this in front of the h4:
[data-website-fonts]

i.e.

[data-website-fonts] h4 {
  font-family: 'LALUXES' !important;
}

You also need an @ in front of the font-face {

@font-face {
  font-family: 'LALUXES';
  src: url('https://static1.squarespace.com/static/6481c2b9614bdc3272a8d4a5/t/64c171fe084d1343cf9f2a0e/1690399230708/La+Luxes+Script.ttf');
}

Hope those changes work for you!

13 minutes ago, Ziggy said:

Hope those changes work for you!

Thank you so much! Working now 😃

My leading suddenly evaporated - using Paragraph 1. Type is virtually sitting on top of each other, line-by-line. Incredibly unsettling. Apologies if this is the wrong forum. Anyone have any updates as to why this suddenly changed and when a fix will be automatically made?

On 7/27/2023 at 11:18 AM, Gddy said:

My leading suddenly evaporated - using Paragraph 1. Type is virtually sitting on top of each other, line-by-line. Incredibly unsettling. Apologies if this is the wrong forum. Anyone have any updates as to why this suddenly changed and when a fix will be automatically made?

What is your site url?

Thanks, Tuan. I just emailed you directly.