Jump to content

Custom font not working properly in other devices

Recommended Posts

Site URL: https://pumpkin-parrot-mnr6.squarespace.com/

Hi. I'm working with a few different custom fonts. They are working fine on my device, but when I view the site from my phone, there's one font that's not working and it defaults to Times New Roman. 

Site password is tnw2022.

Here's my custom CSS.

@font-face {

font-family: 'Moontime-regular';
    src:   url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627def058a7c847bdc20bb27/1652420357223/Moontime-regular.ttf');

h1 {font-family: 'Moontime-regular'}

This is the one that's displaying in my device but not from my phone — I'm using it specifically for h1.

Link to comment
  • Replies 3
  • Views 247
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

You added this code. It is invalid. Each font = each font face code

@font-face {
    font-family: 'Moontime-regular';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627def058a7c847bdc20bb27/1652420357223/Moontime-regular.ttf');
    font-family: 'Frunchy';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627defc1ec6fe12f71287930/1652420545899/Frunchy.otf');
    font-family: 'OpenSauceOne-SemiBold';
    src: url(https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627e06cff0f8ca73444a90f7/1652426447642/OpenSauceOne-SemiBold.ttf);
    font-family: 'OpenSauceOne-Regular';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627e08c0dd576325de9a82d5/1652426944227/OpenSauceOne-Regular.ttf')
}

It should be

@font-face {
    font-family: 'Moontime-regular';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627def058a7c847bdc20bb27/1652420357223/Moontime-regular.ttf');
}
@font-face {
	    font-family: 'Frunchy';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627defc1ec6fe12f71287930/1652420545899/Frunchy.otf');
}
@font-face {
	font-family: 'OpenSauceOne-SemiBold';
    src: url(https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627e06cff0f8ca73444a90f7/1652426447642/OpenSauceOne-SemiBold.ttf);
}
@font-face {
    font-family: 'OpenSauceOne-Regular';
    src: url('https://static1.squarespace.com/static/627d817cb6036a2123af28fd/t/627e08c0dd576325de9a82d5/1652426944227/OpenSauceOne-Regular.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

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.