Jump to content

I've found a way to load only safe-fonts on site (or only selected ones) without all the junk it load by default. ver 7.0

Recommended Posts

Yes, squarepace load too many fonts by default. I was able to remove all webfonts from squarespace and i'm using only safe-fonts now. There are few parts for the tricks and some glitches and bugs in squarespace that I learn in the way (using 7.0) so by using this method you wont download any webfont and squarespace junk,

First of all, you you will need a Typekit account (adobe fonts).

Use fonts from the typekit site by putting your typekit ID in “external api keys” and change all the group of fonts you able to find in each squarespace page as blog\products\album etc to fonts that you load from the adobe site only (typekit and not the one that embedded in squarespace) ... later you can add inject script of the css for the typekit as described in adobe site in the header for speed gain (and the trick). In december 2020 its  <link rel="stylesheet" href="https://use.typekit.net/xxxxxx.css">  just change xxxxxx to your typekit name. first of all using typekit only fonts already remove lot of fonts that squarespace load by default (for some site in 7.0 it could be more than ten). later on, while still using typekit in "external api keys" page in settings - go and change all the fonts to a safe font that you like (ariel, etc...) or if you already ok with using one or more fonts only from adobe typekit site than its ok. Now you can keep only the injected code that load the css typekit and remove the “external api keys” (But more details after, because of another bug that it can cause)

anyway for complete safe-font experience keep the type code in “external api keys” and after you change all the fonts in each page to safe font and you aren’t seeing other fonts in design-styles page even not the typekit that you choose from adobe typekit site (it shows typekit, but not selected) - you are able to remove the typekit code from the "external api keys" and then from inject header. for some it could already work, and you will be able to not using any webfont. but and this is a big but - each time you will touch the design style panel it will reset. so, each time you want to make a style change, put the typekit key back in "external api keys". after the changes you do, erase it. hope it helps someone.  i'm aware there are lot of bugs in the process that i was able to find, and use it for my benefit. but i know it could be tricky and you maybe need to do it few times in different order. And by the way, i'm not in developer mode. Maybe one day I will write a more detailed (and organized) way to speed squarespace while still not using developer mode. Anyway its 3 am in the night-  Sorry it came out messy.


Screenshot 2020-12-09 020931.png

website www.roitmanphoto.com

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

I'm not able to edit the original post. if you prefer to use only few or one typekit fonts - then keep the injected script in header and remove in "external api keys" (or the opposite). but remember that each time you touch the design style panel when you use the injected css without "external api keys" - it will reset and load the junk fonts again. (anyway don't load two typekit loader in the same time. keep in "external api keys" for the buildin javascript version that squarespace use, or the new css way that adobe recommend).

website www.roitmanphoto.com

Link to comment


This topic is now archived and is closed to further replies.

  • 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.