Disclosure: This post contains affiliate link to get custom fonts. If you make a purchase through one of those links, I’ll get a small commission at no extra cost to you. Thanks for your support!
Are you attracted to your website? I mean, if you were to put yourself in your visitor’s shoes, would you look at it and think “dang I love the way the site looks.”
My new friend Freddy recently talked about the three keys to successful blogging. One of those keys was having an attractive design for your website. And he’s absolutely right.
Next to content, the appearance of your site matters a lot.
Now, you can go all out and give your site a totally new look with a new theme.
However, if a new design for your site is not in your budget at this time, sometimes all it takes is a teeny tiny change like adding custom fonts to make your website pop.
I put this tutorial together to show you how to upload fonts using the Use Any Font plugin.
But before I show you how to add custom fonts to your website, make sure you have permission to use the font you’ll be uploading.
Where To Get Fonts
There are a variety of fonts on Google Fonts that you can download for free. But if you really want to add some pizzazz to your website, use fonts that are unique and trendier.
I get my fonts at the Creative Market. They have the funkiest typefaces around and they are affordable. And if you’re a web designer, you know you can never have too many fonts and graphics in your arsenal of tools.
For example you can get this Typographer’s Dream Box* on Creative Market. It includes 50 gorgeous script fonts, 21 typefaces and more than 200 logos for only $15! Plus you get 6 freebies just for your purchase.
Now let me show you how easy it is to upload your new fonts to WordPress.
How To Add Custom Fonts To Your WordPress Site
If you’re not comfortable going into the CSS to add custom fonts, you can use the Use Any Font plugin for WordPress.
The first thing to do is go to the Use Any Font* website and grab an API key. You’ll need one in order to use the plugin.
The plugin is free for one font but if you contribute – even a small amount, you can get use the API Key as many times as you need to. I contributed $30 for unlimited uploads.
After you get an API key, you’re ready to install and activate the plugin.
Step #1 Install & Activate The Plugin
From your WordPress dashboard, go to Plugins and select Add New.
In the keyword box to the right of the screen type in Use Any Font by Dinesh Karki. Click install now and then click the blue activate button.
Now you’re ready to upload your fonts.
Step #2 Verify API Key & Upload Font
From the WordPress dashboard panel on the left, scroll down until you find and click on Use Any Font.
Copy and paste the API key and click verify.
After you’ve verified the API key, below that you’ll see an add fonts button. Click that to upload the font. Make sure it’s in an otf, ttf or woff format.
Add the font name then click upload.
When the conversion is complete, the next thing you do is assign the font.
Step #3 Assign Font
When you click the assign font button you’ll get a drop down of options to assign your font to an element.
Just tick any box you want the font to display. For this tutorial, I chose Headline 1 (h1 tags) and Headline 2 (h2 tags).
And if you’d like to customize it even further, you can add a code in the custom elements box. Let’s say you want to use your custom on for your site’s title.
All you have to do is type #site.title in the first line like the example in the screenshot below. Click the assign font button at the bottom to save your changes.
Step #4 Check It Out
Now check out your site to see the update. If you don’t see your changes, clear cache as well as your browser’s cookies and that should do the trick.
Wrapping Up This Custom Fonts Tutorial
And that’s how you can add custom fonts to your WordPress website without touching the CSS. If you’re ready to give your website a different font, I hope this tutorial helps!
You can also watch the video below!
Are you using custom fonts on your site?
Before you go, I would appreciate it if you would share this post on social media so other bloggers can add some pizzazz to their site with a custom font. Thanks!