If you’re looking to have a CONSISTENT brand (and I know you are, because I taught you all about it right here!), then that means you definitely need to know how to add your custom brand fonts to your Squarespace website!
Today I’m sharing a step by step walkthrough and a little code to help you add your brand fonts to Squarespace!
If you’re all about watching step-by-step tutorial videos, just click below and I’ll walk you through it all!
If you love reading through the steps and taking a peek at screenshots, keep on reading!
First, click “Design” in the left hand menu, and then “Custom CSS”. You’ll arrive at a screen that looks like this:
Even though we are adding code through this tutorial, I promise it’s not scary! It’s as easy as copying and pasting and will not mess anything up, I promise!
Second, copy the code I’ve written out for you below:
@font-face{
font-family: ‘Quentin’;
src: url (‘ ‘);
font-weight: regular;
}
h2 {
font-family: ‘Quentin’;
}
Next, paste the code in the Custom CSS box on Squarespace site next to the number “1”
Next, we’re going to be uploading that custom brand font file, so be sure to locate it on your computer and head on to Step #4.
Click “Manage Custom Files” and then click “Add images or fonts”. Navigate to your file, click on it, and then click “Open”. You’ll now see your font file in Squarespace just like shown below!
Look at the code and then move your cursor in between the two apostrophes shown after “url” and click. See below for reference:
Click “Manage Custom Files” and then click on your custom brand font. This will automatically add the custom brand font url in between those two apostrophes.
In both places where you see “Quentin” referenced, simply replace that with your custom brand font name. You’ll want to make sure it is spelled the exact same way that it is written in the font file you uploaded.
If you’d like your custom brand font to become a Heading 1 or Heading 3 font, simply erase the “2” and replace it with the heading number you’d like your font to show as.
Finally, click “Save” in the top, left hand corner and you’ve officially added your custom brand font to your Squarespace website! Congrats!