WordPress comes with a variety of fonts that are ready to use. With approximately 40% of all websites built on the platform, using different fonts can help your website stand out.
Custom fonts help you better establish your brand identity, increase readability, and create a better, unique overall experience for your visitors.
Custom Fonts
WordPress themes do not contain all the fonts out there. However, there are several free and paid fonts that can be used to get the fonts you need in WordPress, the two main ones being Google and Adobe.
Google Fonts
Both beginners and experienced users alike use Google Fonts because they are quick and easy to get up and running.
Other benefits include the wide variety of fonts, performance (fonts are served from Google servers and fast content delivery helps SEO), they are regularly updated, and perhaps most appealing of all, they are open source and free to use.
Add Google Fonts to WordPress Using a Plugin
As with most things WordPress-related, there is a plugin for that. In this case, it’s called Google Fonts Typography by Fonts Plugin.
To install the plugin, log in to your WordPress website via wp-admin. Once you’re logged in to the WordPress main menu, you’ll need to hover over where it says “Plugins” in the left menu and click “Add New Plugin.”
The Add New Plugin screen should load after a few seconds. Type “Google Fonts Typography” into the search bar at the top right and you should see the plugin appear as the first result.
Click “Install Now” and then hit the “Activate” button. Once the plugin is activated, a “Fonts Plugin” item will appear in the left menu. Click “Customize Fonts” in the admin sidebar. This will take you to the theme customizer in WordPress and should open the Fonts Plugin section.
Clicking on “Basic Settings” will allow you to change the default fonts for your website. “Advanced Settings” allows you to change fonts for specific areas.
Basic Settings
Basic settings allow you to change the font of your titles, buttons, and written content.
The drop-down menus under “Font Family” provide a list of fonts to choose from, with your current default font at the top of the list. After choosing a font, you’ll see a preview.
Advanced Settings
Advanced Settings presents the same options as Basic Settings, but divided into more specific options, so you can fine-tune your selections.
Here is a brief description of each option:
Branding – Change the font for your site’s title and description.
Navigation – Set the typography for your navigation menus.
Content – Make changes to the typography for your content, as well as each of your header tags.
Sidebar – Font controls for your sidebar headers and content.
Footer – Font controls for your site’s sidebar headers and footer content.
You can choose which font you want to use by selecting it from the drop-down menu. When you are happy with your choices, you can click “Publish” to make your changes live.
Adobe Fonts
Adding Adobe Fonts to WordPress is similar to adding Google Fonts using the methods above. The main difference is that you need to sign up for Adobe Fonts before you can select a font from the library.
Another significant difference is that not all of the fonts you’ll see in Adobe Fonts are free and open source.
To manually embed the font into your website, select the “Add to Web Project” option.
If you don’t have a project yet, you can create a new one:
After clicking “Create,” the code will be provided for you to copy to your website.