How to Upload and Use Custom Web Fonts with Your Theme

The first thing is to make sure you have converted your font file (.ttf) into valid web safe fonts (.eot, .svg, .ttf, .woff, .woff2). You can do that by using a free service like font squirrel’s web font generator.

Here is a tutorial on how to generate web fonts for use with your Angie Makes Theme.

Now we are ready to begin.

Screen Shot 2014-07-22 at 8.59.05 AM

Screen Shot 2014-07-22 at 8.59.31 AM

Screen Shot 2014-07-22 at 8.59.50 AM

Make sure you upload and select all 5 web font files. (.eot, .svg, .ttf, .woff, .woff2)

Screen Shot 2014-07-22 at 9.00.01 AM

Screen Shot 2014-07-22 at 9.00.47 AM

Now you can paste in the font name into the font family input. However, once you upload your font, the font name will not show up in the drop down list until you refresh the page.

Screen Shot 2014-07-22 at 9.02.07 AM