How To Change The Font In Wordpress-Header

How to Change the Font in WordPress


After many hours invested in trying to create a website that not only looks attractive but is user-friendly and organized, you realize you don’t like the way things have turned out. Chances are, you may be unhappy with the font style of your site. It doesn’t reflect your unique niche. At this point, you want to spruce it up by playing around with different font options that you feel represent your brand identity to the maximum. The best option for you is to jazz up the appeal of your website through customization of its design and display.

Your font selection is a vital part of the design process and is essential for your brand’s identity. However, customizing fonts can be frustrating when you realize you don’t know how to do it. After watching online tutorials, you realize your website theme doesn’t offer you the font of your dreams when you eventually learn a method or two. 

The good news is that WordPress is a highly user-friendly website-building platform and comes with a built-in option to select your choice of font from a curated list. Doing so is also made easy and convenient with just a few clicks and scrolls. Some methods for changing fonts may be easy for you if you’re tech-savvy. If you’re not, there are other more straightforward automated options offered by WordPress. Below, we’ll share them all so you can end your struggles with changing the font of your WordPress site. 

How Do You Change the Font in WordPress?

Sometimes in WordPress, changing the font style and size becomes necessary in the website design process. You need to customize the font to suit your brand identity and business goals. At other times, you just want your site to look pretty and attract traffic. Either way, WordPress provides lots of options for that to happen.

Fonts in WordPress can be customized in four basic ways:

  • WordPress Customizer
  • WordPress Site Editor
  • Plugins
  • Custom CSS, or the manual method

The last of the above four methods is for people with a sound technical base and who have perhaps gained enough experience designing and customizing websites. For them, playing around with codes is not an issue. For others, there are the rest of the three options. So let’s dive right in and explore these methods one by one. 

How to Change the Font in WordPress Using WordPress Customizer

In most of its new themes, WordPress offers the convenient and user-friendly option of changing a site’s font using its Customizer. The WordPress Customizer gives you choices to play around with the style and design of your page layouts, fonts included. Although it’s good to remember that all themes operate differently and thus have different features. This determines their menus and sub-menus. At such times you have to search and locate specific settings that you want to get to. 

To change your site’s font through the Customizer, go to the WordPress dashboard and select the Appearance tab. From there, go to Customize and select Typography. Although, as we mentioned, each theme will differ in where its font option is located in the Customizer menu. 

Once in the Typography sub-menu, choose your desired font from the available options. Moreover, depending on your theme, you will be shown options of changing the font for the type of content, such as headings or base text. Thus you need to click your preferred content type and your preferred font. A live preview of your website will appear. If you’re satisfied with how it looks, save and publish your changes. 

Also, it is pertinent to note that how many font options appear in your Customizer will also depend on your theme.

How to Change Font in WordPress Using Site Editor

If your site uses a theme that supports the WordPress Site Editor, you can also use this super easy and fast option of changing your site’s font. Simply open the Site Editor, go to the ‘Styles’ tab, and select ‘Typography’. From there, select your desired font. 

If your theme supports the Global Styles option, you can change your fonts through this route. Simply go to the WordPress Dashboard and click either the ‘Add New’ tab, or click on an existing page title, to open your website page in the Editor. Once your page appears before you, look for the Global Styles tab, which appears as Aa and can be found between the Settings tab and the green Jetpack tab. Once you locate the Global Styles tab, click it to open a dropdown menu under the ‘Content Type’ tab to see and select various font options for different content structures like headings or paragraphs. Save and publish your changes once you have made a choice and are happy with the results in the preview.

How to Change the Font in WordPress Using Plugins

If you’ve already exhausted both the above options for changing the font in your WordPress site but cannot find a font that you really want, you can try installing different plugins that provide you with thousands of new fonts. Also, you can access the huge number of fonts in the Google catalogue. 

One of the most popular and widely used options is the Google Fonts for WordPress plugin. With access to thousands of fonts in the Google catalog, you’re sure to find the right one for your site.

To get started, simply download and install the Google Fonts for WordPress plugin. Once it’s activated, you’ll be able to browse the entire Google font library directly from your WordPress dashboard and select them for different parts of your website. From there, you can preview different fonts and styles (both Google Fonts and Adobe Fonts for free), and even customize settings like font weight, size, colour and line height.

When you’ve found the perfect font for your site, you can use it on your Gutenberg editor, classic editor or on your entire website, as noted by the well-written documentation online. And that’s it – with just a few clicks, you can completely transform the look and feel of your WordPress site using the Google Fonts for WordPress plugin.

How to Change the Font in WordPress through Custom CSS

For those who are more tech-savvy than others and don’t mind playing around with codes, you have the added option of customizing fonts for specific parts of your website as a default feature. This can happen when you apply custom CSS to your site. In order to do this, though, first of all, you will have to identify the CSS script that works on the specific part of your text that you need to customize. 

You can either change the font globally across your theme through the custom CSS method or select and apply changes to a specific part. The first option is more straightforward; all you need to do is go to the Appearance Editor in the WordPress Appearance section. At the bottom of the page, you’ll find your theme’s CSS style sheet. This sheet tells you what font is active in the theme currently. To change your font all across the site, add this one-liner code at the top of the style sheet:

                                                  { font-family: “font name” }

For the second option of changing the font of specific areas of the text, the key is to identify what script is applied to that area and change its CSS code accordingly. For more details, you can check our page on ‘how to change CSS codes on your WordPress site.’

How To Change The Font In WordPress-Inner-01

How to Change the Font Size in WordPress

At times, you may need to make a specific part of your text stand out by making it larger or smaller. Variance in text sizes is essential for several reasons. For starters, it helps increase the UX factor of your site, as it organizes your content into neat sections and blocks. Also, it helps the readers by providing reading cues and enables them to quickly get to the parts of their interest. It thus helps in attracting more traffic to your website. Overall, variance in text size is good in creating visual appeal to your display as it helps break the monotony.

There are a few ways we can change the font size of the different parts of WordPress websites. Let’s see all of these below.

Use Headings in WordPress Block Editor

The use of headings is a great way to catch your audience’s attention and increase the user experience of your website. Demarcating text into headings and subheadings helps to organize the content. Also, headings are particularly useful in increasing your SEO rankings. Try to always incorporate headings into your text and enlarge their font size to immediately grab the reader’s attention. 

To apply headings in your content through the WordPress Block Editor, click on the ‘heading block’ of the text section in the Editor. Put your desired text that you want to turn into a heading there. Remember that the block’s default heading is set to H2, but you can change this if you want. 

If you’re using the Classic Editor, click on the ‘Paragraph’ tab’s drop-down menu, highlight the text you want as a heading, and choose your preferred heading size in the drop-down menu. 

How to Change the Size of the Text in WordPress Block Editor

Sometimes, you may want to change the font size of a particular part or paragraph of your text. For this, you can once again use the Block Editor. For customizing font sizes, click on any paragraph or content block. Under the ‘Typography’ tab on the right, select your desired font size in the drop-down menu. You can also set your custom font size by manually typing in the desired pixel size. 

However, these options are not available in the Classic Editor version of WordPress. So you may consider upgrading your editor. 

How to Use Plugins to Change Font Size

Plugins often provide us with more options and control over our content customization process in WordPress. In the case of changing the font sizes of your theme, the most popular plugin available is ‘Advanced Editor Tools’, previously known as ‘TinyMCE Advanced.’

You can install the plugin from the WordPress website. Upon installation, you will see a ‘Classic Paragraph’ block added to the control settings. To activate and use the different features of the plugin, open your settings menu and click on the Advanced Editor Tool to configure the Editor’s settings. You can select the tabs you want to use in the plugin toolbar. You can drag and add the font drop-down menu here. In the case of the Classic Editor, the plugin will already have enabled a font drop-down menu in the toolbar. 

Once you configure the plugin settings, you can easily use the ‘Classic Paragraph’ features of changing font sizes through your Block Editor and from the drop-down font menu in the case of the Classic Editor. 

How to Use Custom CSS to Change Font Size

Using a custom CSS code can be challenging for many, but it provides the comfort of not manually changing the font size of your desired paragraphs or content blocks each time. You may also need to learn this manual method if your theme does not support changing fonts through the Customizer or Editor options. 

To change the font size by feeding in custom CSS, open your WordPress Customizer and select the ‘Additional CSS’ tab. There is where you can feed your custom CSS codes. Under the Additional CSS text box, add your code. The codes for changing the font size of paragraphs and headings are different, and whatever size you require for each content type can be mentioned in your code. 

Can You Change the Font in the WordPress Menu?

Being an easy-to-use platform, WordPress lets you customize its displays and menus with a few clicks. However, you may require a workable knowledge of CSS code, as you will have to edit the code to make such changes to the WordPress menu. 

Log in to WordPress and open the Appearance Editor from the Dashboard to proceed with this method. Go to the ‘Customize’ tab, select ‘CSS from your admin dashboard’ and feed in your custom CSS in the following form;

                 . Primary- navigation { font-size: XXpx; }

The XX in the code above denotes your preferred font size for your menu, and the px stands for the font pixels. Once you put in the code, click ‘update file.’ 

How To Change The Font In WordPress-Inner-02

How to Enable Appearance Editor in WordPress

The Theme Editor in the Appearance menu on the WordPress Dashboard is a great tool and resource as it allows you to edit the files of your themes directly from the Dashboard. These features are beneficial when you want to edit the style.CSS file to change the existing CSS codes. 

However, several users report not seeing the Editor on their site’s Appearance menu. There can be several reasons for this. The theme you are using, and any plugins you’ve installed can play a role in the disappearance of your Editor. So an easy solution would be to switch off all plugins, set your site to a default WordPress theme, refresh the page, and re-check for the Editor in the Appearance menu. 

If this still doesn’t help, try reinstalling WordPress from the Dashboard’s updates section.

How to Change Font Size of Widget Titles in WordPress?

Changing the font sizes of the WordPress widgets, both titles and content, is somewhat similar to changing the font size of your website’s text. 

You can now have your widgets appear just as you want in a few simple steps. Go to the WordPress Dashboard, on to the Appearance section, click ‘Customize,’ then ‘Content,’ and finally click the ‘Widgets’ tab. From the sub-menu that appears, select ‘Typography’. You will be given options of changing the content type in the widgets, either content or title. Select your desired changes and click publish. 

Final Thoughts

WordPress is a reliable solution for people new to building websites and makes the entire process convenient and user-friendly. Its latest version offers even more flexible options to customize your site. This means you can easily change your theme’s fonts to suit your mood and brand’s identity through its built-in features and external plugins. We hope our post will help you select a method that best fits your situation and enables you to easily change font style and sizes to enhance your site’s user experience. 

Last modified on: August 23rd, 2023

Categorized as Web Hosting

Mehreen is a content writer with an added experience in proofreading and editing. She is a history buff who loves her book collection, especially South Asian history titles. While she is a good swimmer and a fitness freak, she also finds her zen painting and embroidering.

decorative squiggle

Skyrocket your online business with our powerful Shared Hosting

Shared Hosting from HostPapa is suited for all your business needs! No‑risk 30‑day money‑back guarantee. 99.9% uptime guarantee. 24/7 support. Free setup & domain name.†

Related Posts

HostPapa Mustache