This tutorial will show you how add custom fonts on squarespace Squarespace. Adding custom fonts is another way of implementing new creattive elements to the design of your site away from the custom Squarespace template provided.

Complexity: Easy

Step 1

Start by coping and pasting the code below into your Custom CSS, this can be found under Design > Custom CSS

Step 2

At the bottom of the CSS window, there is the ‘Manage Custom Files’ button, click that and upload your font file.

Step 3

Within the first set of quotation marks (after “font-family:”) enter the name your font. For this example, font-family will be ‘AGRANDIR‘.

Next, click between the second set of quotation marks with “Font_URL“, delete the Font_URL, and then click on the file you uploaded as you should have something like what is shown below.

Step 4

With your font ready, can now assign it to specific text classes to be able to view them on your website.

In this example, you will replace ‘FONT-NAME’ with ‘AGRANDIR‘.

Step 5

Repeat steps 1 and 2. to add more custom font. Please note for SEO effeciency, it is better to have a maximum of 2 custom fonts.

If you have any questions or need any help with your Squarespace website design, you can book a 1:1 consultation.

All work in this guide is provided ?“AS IS”. Other than as provided this guide makes no other warranties, express or implied, and hereby disclaims all implied warranties, including any warranty of fitness for a particular purpose.

If you require professional advice, you can book our consultation services.