Adding a google font not currently incorporated in 7.1

Hi all, Does anyone know how hard it would be to custom code a non supported font into 7.1? I want to use a standard google font which isn't included but not if it's going to be a very difficult thing to do. I am new to the platform still trying to decide if it's right for an upcoming project.

There's a lot of built in fonts for the Squarespace 7.1 templates and it looks like they are adding new ones consistently. I don't think they currently support custom fonts installed by you (the user), but there is a nice selection to choose from that is serif, sans serif or a mix of both.

Navigate to Designs --> Site Styles --> Fonts and click the Switch link to choose from the list of all fonts.

Newly available fonts are labeled with the "New" icon on the right side.

46 minutes ago, Alpen said:

Does anyone know how hard it would be to custom code a non supported font into 7.1? I want to use a standard google font which isn't included.

You can add any Google Font to a Squarespace 7.1 site but it won't appear in the site styles panel. Instead, you'll need to add it with code (requires a Business Plan or above) and then use Custom CSS to apply it to the areas where you want to use it.

@Alpen To achieve this you'll need to use Custom CSS. 

In the menu if you select 'Design' and then 'Custom CSS'  and scroll down you will see a button labelled 'Manage Custom Files'. This is where you'll need to upload your font file. 

Then in the CSS area you'll need to add some code - 

@font-face {
  font-family: 'fontName';
  src: url(font location);
}

And then using CSS you can assign this font to different blocks / heading types.

You can upload a font and use the following code to target/assign it.

@font-face {   
font-family: 'font-name';   
src: url(URL.ttf/.otf);}

ThE URL can be an external link, but my preferred method is to upload the font under "Manage Custom File" which is right below the CSS window.

Then target whatever H or P's your wanting using the following code.

h1 {
font-family: 'font-name';}