How to Change Fonts in WordPress (Direct and Plugin Methods)

How to Change Fonts in WordPress

Do you want to change fonts in WordPress to make texts more readable? If so, you’ve reached the right post. Today, we’ll tell you how to change your font family, size, and color in simple steps.

You may find thousands of free and premium fonts in different categories on the web. Each font type has its own purpose. Some may be suitable for designing brochures and ads, but not for headlines. Some others could be fit for writing letters. So it’s your responsibility to find the right font to meet your requirements.

If you want the best font for your website, it should be lightweight and easy to read. Thus, you can ensure that it loads fast on all devices, and visitors can read texts without hassle.

Web fonts vs Local fonts

Google Fonts

Which is the best method to use custom fonts in WordPress? Should you use web fonts (e.g., Google Fonts) or local fonts hosted on your hosting servers?

Most WordPress themes come with dozens of premium-quality fonts. You can change fonts easily through theme settings. If you are looking for a custom font, consider Google Fonts. They have a huge font collection across various languages.

Embed Google Fonts

Choose a font you like, collect its embed code, and paste it into your website’s header file to start using.

Premium font providers are also available to find and buy premium-quality fonts on a license basis. 1001fonts.com, fonts.com, and fontsquirrel.com are popular font providers in this category.

Web fonts are easy to use. Frequent, automatic update is a major advantage of web fonts. On the other hand, if you manually upload fonts to your website, you should update them at regular intervals.

How to Change Fonts in WordPress Themes?

Modern WordPress themes will have a typography section to manage fonts for header types, body, widgets, and others. Open your theme settings or visit Appearance > Customize to locate the respective section and change fonts.

typography settings

From the theme’s typography settings, you can change font families and colors of various heading types, body texts, button texts, etc, on your site. Apply font size, decoration, and others in this section.

If you’re unable to locate the section, go to the Custom CSS section (Appearance > Customize> scroll down to the bottom) and enter the following code,

h1 {
font-family:’Montserrat’, sans-serif;color:#2a2727;font-size:22px;
font-weight:700;
}

It will change your current <h1> font to Montserrat or Sans-Serif type. Replace h1 with other heading types (h2, h3, h4) or body to change fonts for them. Don’t forget to change the color attributes as you need.

For the body section, the code will look like this,

body {font-family: Arial, Helvetica; font-size:17px; color:#000000; }
Read How to Duplicate a WordPress Page or Post in a Single Click (3 Ways)

Best WordPress Font Plugins

Searching for the best WordPress font plugins to automate the process? Let us check the top custom fonts in this category.

1. Fonts Plugin

Fonts plugin

Fonts is a simple plugin that allows you to add custom Google Fonts to your website. No complex settings to configure. Just install the Fonts Plugin, and you will be ready to go.

After installation, visit Appearance > Customize to see the Google Fonts menu at the top.

Google Fonts setting

Click the menu to find additional options. Change fonts for your site title, navigation, header types, sidebar, footer, and other parts of the website. Hit the Publish button to save changes.

Fonts Plugin contains more than 900 Google Fonts that you can host locally to reduce their loading time. Changing font size, color, and weight for various sections is also possible.

2. Custom Fonts

Custom Fonts

Custom Fonts is another popular WordPress plugin to embed or upload your fonts easily. It is fast, easy to use, and supports all major font types.

After activation, head to Appearance > Custom Fonts to upload custom fonts to WordPress. Either upload files from your computer or insert font URLs to assign them to your texts. The plugin is compatible with all popular WordPress themes and page builders.

3. Use Any Font

Use Any Font

Use Any Font is one of the best free font plugins for WordPress. It allows you to upload custom fonts to your website easily. Upload your file in any font format, and the plugin will automatically format it to work on all browsers.

It is fast and compatible with all WordPress themes. You can also rename fonts so no one can track which fonts you use.

How to Change Font Color in WordPress Posts?

Do you want to change the font color in WordPress posts and pages? For that, built-in settings are enough to make changes. So, there is no need to change codes or install font plugins to customize your content texts.

Sign in to your WordPress dashboard and visit Posts/Pages. Create a new post or edit the existing one to customize.

Change fornt colour wordpress

Select your text block, then head to your block settings on the right sidebar. Under Color, click on Text. A box will open with a couple of color options. Pick one of them or set your favourite color from the color picker.

The selected color will apply to your block in the selection. You will find an option to set font size under Typography on the same sidebar. WordPress allows you to set font size as Small, Medium, Large, or Extra Large, or assign a custom size for your selected text.

If you are not using the Gutenberg editor and are still using Classic editor, follow these steps:

Change font color in wordpress

Click the toolbar toggle button (Shift+Alt+Z) from the menu to see the hidden options.

Choose texts for which you want to change the color. Click the text color button, select a color from the panel, or choose the custom option to set a color.

That’s it.

Your font color has been successfully changed. Unfortunately, you can’t find any option to change font size on the default menu. So you should switch to the HTML editor to adjust the size.

change font size wordpress

Press your keyboard’s Ctrl + F keys to get the Find box. Enter ‘font-size’ in the field. Locate your text and increase or decrease its font size accordingly. Alternatively, you can install Advanced Editor Tools to change your font family, size, and assign a background color to your texts.

Read How to Install WordPress Themes (Beginners Guide) – 3 Ways

FAQ

Tags: , , ,

Leave a Comment

Your email address will not be published. Required fields are marked *