Themes & Design

How to Change Font on WordPress

WordPress theme and design tips

When you learn how to change font in WordPress, you can instantly make your site look more professional and easier to read. Fonts affect how trustworthy, modern, and readable your pages feel, so choosing the right typography is one of the fastest design upgrades you can make.

In this guide you will change fonts in a modern block theme using the Site Editor, adjust fonts in classic themes with the Theme Customizer, tweak fonts for individual blocks, use a font plugin for more choices, and finish with a simple custom CSS example. By the end, you will know exactly which method to use on your own WordPress site without breaking your design.

What You Need to Start

  • Administrator access to your WordPress dashboard.
  • Your current theme name, and whether it is a block (FSE) or classic theme.
  • A list of pages or templates you want to update, such as your blog posts and main landing pages.
  • Optional test or staging site if you want to experiment with fonts before changing the live site.
  • Optional file access to your hosting or a child theme if you plan to use custom CSS.

Step 1: Understand How Fonts Work in WordPress

Before you change font in WordPress, it helps to understand where fonts are controlled so you choose the safest method. Modern block themes use the Site Editor and a Font Library, while older classic themes still rely on the Theme Customizer or extra plugins.

  1. Log in to your WordPress dashboard by visiting /wp-admin on your domain.
  2. In the left menu, click Appearance.
  3. Look for either Editor or Customize under Appearance.
  4. Note what you see:
    • If you see Editor, you are likely using a block theme.
    • If you see Customize, you are likely using a classic theme.

This quick check tells you which main method you will use to change font in WordPress on your own site.

Quick Comparison of Font Change Methods in WordPress

The table below summarizes the main ways to change font in WordPress and when each method works best.

Method Works Best On Difficulty Best For
Site Editor Styles Typography Modern block themes with full site editing Easy Changing fonts globally across your whole site with a few clicks.
Theme Customizer Typography Panel Classic themes with Customize options Easy to Medium Changing fonts for headings and body text without code.
Block Editor Typography Settings Any site using the block editor Easy Adjusting font size, weight, and appearance for specific blocks.
Font Plugin Sites that need extra Google Fonts or custom fonts Medium Adding many new fonts without editing theme files.
Custom CSS Any theme with Additional CSS or child theme Advanced Precise control over specific elements or fixing theme limitations.

Next you will use these methods step by step so you can safely change font in WordPress regardless of which theme your site uses.

Step 2: Change Font in WordPress Block Themes with Site Editor

If your site uses a block theme, the safest way to change font in WordPress is through the Site Editor. This lets you change fonts globally without touching code.

  1. In the WordPress dashboard, go to Appearance and click Editor.
  2. When the Site Editor opens, click the Styles icon (usually a half-filled circle) in the top right corner.
  3. In the Styles panel, click Typography.
  4. Choose the element you want to change such as Text, Headings, or Links.

Use the Typography panel to pick a new font family and adjust weight, size, and line height for each element.

  1. Click the current Font name to open the font chooser or Font Library.
  2. Select the new font family you want to use for your headings or body text.
  3. Adjust the Size, Appearance (weight), and Line height sliders until the preview looks readable.
  4. Click Save, then confirm all template changes in the dialog.

To verify your changes, open your homepage and a blog post in a new tab. Confirm that headings, paragraphs, and menus use the new font consistently on both desktop and mobile.

Step 3: Change Font in WordPress Classic Themes with Theme Customizer

Many classic themes, including popular magazine themes, still rely on the Theme Customizer. You can often change font in WordPress here without a plugin.

  1. From your dashboard, go to Appearance and click Customize.
  2. Wait for the live preview and options panel to load on the left.
  3. Look for a section named Typography, Fonts, or Theme Options.
  4. Click into the typography section for Body, Headings, or Menus depending on what you want to change.

The Customizer shows a live preview so you can test different fonts before publishing.

WordPress Customizer interface showing theme customization options for Site Title & Logo, Site Icon, Buttons, and Colors, with Astra theme active.
Site Title & Logo, Site Icon, Buttons, and Colors, with Astra theme active.” width=”1100″ height=”536″> The WordPress Customizer provides a live preview interface to adjust your theme’s site identity, colors, and typography.
  1. Use the dropdown to select a new Font family for body text.
  2. If available, set separate fonts for Headings (H1–H6) and Body content.
  3. Adjust the font Size, Weight, and Line height until the preview looks balanced.
  4. Scroll through different pages in the live preview to make sure the new font works well everywhere.
  5. Click Publish to apply your typography changes to the live site.

To double check, open a few posts and category archives in a normal browser tab and confirm that the new fonts match what you saw in the Customizer preview.

Step 4: Change Font Settings for Individual Blocks

Sometimes you do not want to change font in WordPress globally, you just want to style a specific heading or callout. The block editor includes per block typography controls for this purpose.

  1. From the dashboard, go to Posts and click All Posts.
  2. Open the post or page you want to edit by clicking Edit.
  3. Click on the block whose text you want to change, such as a Paragraph or Heading block.
  4. In the right sidebar, expand the Typography section for that block.

The block settings let you change font size, weight, letter spacing, and sometimes font family depending on your theme.

  1. Use the Size control to choose preset sizes or enter a custom value.
  2. Adjust Appearance or Weight to make text bold or lighter.
  3. If your theme exposes font families per block, pick a different font just for that block.
  4. Update the post and use Preview to see how the block level font changes look on the front end.

Check your page on both desktop and mobile to make sure block level font sizes do not look too large or too small compared to your global typography.

Step 5: Use a Font Plugin When Your Theme Is Limited

If your theme does not include many typography options, you can still change font in WordPress by installing a dedicated font plugin. These plugins often integrate Google Fonts and let you assign fonts to headings, body text, and specific selectors.

  1. In the dashboard, go to Plugins and click Add New Plugin.
  2. Use the search box to look for a reputable font plugin such as one that adds Google Fonts or custom fonts.
  3. Click Install Now on the plugin you choose, then click Activate.
  4. After activation, look for the plugin’s settings under Appearance or in a new menu item.

Most font plugins provide a panel where you can map specific fonts to headings, body text, and other elements.

  1. Open the plugin settings and select the main Font family for Body text.
  2. Choose separate fonts for Headings if the plugin supports it.
  3. Use any built in preview feature to verify how the new fonts look with your current theme.
  4. Save your settings, then visit your homepage and a single post to confirm that the new fonts are loading correctly.

If anything looks broken, you can temporarily disable the plugin and your site will fall back to the theme’s default fonts while you troubleshoot.

Step 6: Change Font in WordPress with Custom CSS

For advanced control, you can change font in WordPress using custom CSS. This is useful when your theme or plugin does not expose the exact element you need to style.

  1. From the dashboard, go to Appearance and click Customize.
  2. In the Customizer sidebar, scroll down and click Additional CSS.
  3. Identify the CSS selector you want to style, such as body for all text or h1, h2, h3 for headings.
  4. If you plan to use a Google Font, make sure the font is loaded by your theme or a plugin first.

Use the Additional CSS box to paste a simple rule that overrides your existing font family.

/* Set a global body font */
body {
  font-family: "Open Sans", Arial, sans-serif;
}

/* Use a different font for headings */
h1, h2, h3, h4, h5, h6 {
  font-family: "Merriweather", "Times New Roman", serif;
}
  1. Wait for the live preview to refresh and confirm that the new fonts appear correctly.
  2. If everything looks good, click Publish to save your CSS changes.
  3. Open your site in a new tab and check multiple pages to make sure no elements look broken.
Whenever possible, use a child theme or the Additional CSS panel so your custom font rules are not lost when you update your theme.

Step 7: Review Your Typography on Desktop and Mobile

After you change font in WordPress using any method, it is important to review the results carefully. Fonts that look great on a large screen can be hard to read on smaller devices if sizes or line heights are not adjusted.

  1. Open your homepage, a blog post, and a content heavy page such as a guide or FAQ.
  2. Check headings, body text, navigation menus, and buttons to ensure the new font is applied consistently.
  3. Resize your browser window or use your phone to see how the fonts look on mobile screens.
  4. Look for line breaks that feel awkward and any text that looks too light or too bold.
  5. Return to the Site Editor, Customizer, or plugin settings to fine tune sizes and weights where needed.

Spending a few extra minutes on this review step helps you keep your typography both attractive and readable across all devices.

Conclusion You Can Safely Change Font on WordPress

Now you have seen several ways to change font in WordPress, from global controls in the Site Editor and Theme Customizer to block level tweaks, font plugins, and custom CSS. You can pick the method that matches your theme and your comfort level with code.

Make font changes on a staging copy when possible, test your typography on both desktop and mobile, and keep your font choices simple and consistent. With a clean, readable font system in place, every new post you publish will be easier and more enjoyable for visitors to read.

Further Reading

Frequently Asked Questions About Changing Fonts

Why do my font options look different from this guide

Font controls depend on your theme and plugins. Block themes use the Site Editor Styles panel, while classic themes rely on the Theme Customizer or custom options pages. If you do not see the same menus, check whether your theme is a block or classic theme and look for Typography or Fonts sections under Appearance.

What is the safest way to change font in WordPress

The safest way is to use the built in tools your theme provides, such as the Site Editor for block themes or the Theme Customizer for classic themes. These methods are designed to work with your theme’s layout so you are less likely to break spacing or alignment compared to editing theme files directly.

Can I use any Google Font on my WordPress site

Yes, but you should load the font properly. Many modern block themes include a Font Library that connects to Google Fonts, and several plugins can also add Google Fonts support. Avoid pasting random code into theme files unless you are comfortable with CSS and understand where to enqueue fonts safely.

Why did my site get slower after changing fonts

Custom web fonts can slightly slow down your site, especially if you load many font families or heavy variations. To reduce impact, limit yourself to one or two font families, keep the number of weights small, and consider hosting fonts locally or using performance focused plugins and caching.

How do I change font size without changing the font family

You can adjust font size from the Typography panel in the Site Editor or Theme Customizer while leaving the font family alone. In the block editor, select a block and change its size in the Typography settings. You can also use Additional CSS to tweak font sizes for specific elements only.

Will changing fonts affect my SEO

Changing fonts does not directly change your SEO rankings, but it can improve readability and user experience, which are important indirect factors. A clean, legible font can lower bounce rates and keep visitors on your site longer, which supports your overall SEO efforts.

Related Articles

Leave a Reply

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

Back to top button