Jump to content

One Custom Font is Not Loading on Mobile or Other Desktops

Recommended Posts

Site URL: http://www.oasisofharmonywellness.com

Hello,

I uploaded two custom fonts for my website and one of them is working fine on all platforms but the other one is not working on my mobile device or my other computer when I look at the website. In the mobile editor and in the desktop editor it all comes across looking perfectly fine. I don't know what I am doing wrong as I used the same codes for both fonts and one of them works fine. My website is www.oasisofharmonywellness.com. The Arial/Times New Roman looking font is the incorrect one. 

The coding I am using is below and the image is a screen shot of what I want it to look like and what I am seeing is on my mobile and desktop editors.

//ADDING AGENTLETOUCH FONT//
@font-face {
  font-family: 'AGentleTouch';
  src:  url('https://static1.squarespace.com/static/61bb5d6419570a43c54ffe7b/t/61bb9d842274492adc745504/1639685508567/AGentleTouch-Xye2.ttf');
}

//ASSIGN AGENTLETOUCH FONT//
h1 {font-family:agentletouch;}

//ADDING MONTSERRAT FONT//
@font-face {
  font-family: 'Monserrat';
  src: 
    url ('https://static1.squarespace.com/static/61bb5d6419570a43c54ffe7b/t/61bb9db0234a973b71c73e9a/1639685552250/Montserrat-Hairline_0+%281%29.otf');
}

//ASSIGN MONTSERRAT FONT//
h2 {font-family:Montserrat;}

//ASSIGN MONTSERRAT FONT SMALL//
h3 {font-family:Montserrat;}

//ASSIGN AGENTLETOUCH FONT SMALL//
h4 {font-family:AGentleTouch;}

//ASSIGN MONTSERRAT FONT PARAGRAPH//
p {font-family:Montserrat;}

//ASSIGN AGENTLETOUCH FONT BUTTON//
.header-nav-item {
  font-family: 'AGentleTouch';
}

I am not overly proficient in custom coding so any help would be most appreciated. Thank you.

Screen Shot 2022-01-13 at 6.37.47 PM.png

Link to comment
  • Replies 1
  • Views 483
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

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.