Alpen Posted May 12, 2022 Share Posted May 12, 2022 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. Link to comment
abilenecode Posted May 12, 2022 Share Posted May 12, 2022 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. Alpen 1 Link to comment
paul2009 Posted May 12, 2022 Share Posted May 12, 2022 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 1 About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. Link to comment
abibacon Posted May 17, 2022 Share Posted May 17, 2022 @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. Squarespace Developer based in Hampshire, England If you'd like to make a contribution for my time you can Buy Me A Coffee. Link to comment
NadineS Posted May 26, 2022 Share Posted May 26, 2022 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';} Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment