Ever stared at your WordPress site and wished your text stood out more—or maybe looked cleaner and more professional? Font size plays a huge role in how your content is read and received. Whether you want bigger headlines or smaller captions, knowing how to adjust font size gives you better control over your site’s appearance.
In this article, you’ll learn simple, step-by-step methods to change font size in WordPress, along with tips to make your site shine.
Related Video
How Do You Change Font Size in WordPress? A Comprehensive Guide
Changing the font size in WordPress is a common need for website owners, bloggers, and anyone looking to personalize their site’s appearance. Whether you want to make your text more readable, highlight important points, or just match your brand style, adjusting font size can make a big impact. Let’s break down the different ways you can do this in WordPress, from beginner-friendly options to more advanced techniques.
1. Using the Block Editor (Gutenberg)
If you are using the WordPress Block Editor (often called Gutenberg), changing font sizes is straightforward, especially for individual blocks of text.
Steps to Change Font Size in the Block Editor
-
Open the Post or Page
Go to your dashboard, select “Posts” or “Pages,” and click on the one you want to edit. -
Click on the Text Block
Find the paragraph (or Heading) you wish to modify. Click it to select the block. -
Adjust the Font Size
In the right sidebar under “Block” settings, scroll until you see the “Typography” section. Here, you’ll often see options like: - Predefined sizes (Small, Normal, Large, Huge)
-
A custom field where you can enter an exact font size (e.g., 18px)
-
Preview and Update
Always preview your changes to see how they look. If satisfied, click “Update” or “Publish.”
Benefits
- No coding needed.
- WYSIWYG editing (what you see is what you get).
- Fast and easy for beginners.
Potential Challenges
- Controls may be limited depending on your theme.
- Not ideal for changing font size sitewide.
2. Using the Classic Editor
If you prefer the Classic Editor, your options are a bit more limited but still achievable.
Steps to Change Font Size in the Classic Editor
- Open Your Post/Page
- Use the Toolbar Toggle
- Click the “Toolbar Toggle” button for more formatting options.
- Change Heading Styles
- While you can’t change paragraph text size directly, you can apply heading styles (Heading 1–6), which have different sizes.
- Use HTML or Inline CSS (Advanced)
- If you’re comfortable with a little code, you can switch to the “Text” tab and wrap your text in a
` with a style attribute, like:Your Text Here`
Benefits
- Handy if you’re sticking with the Classic Editor for compatibility reasons.
- Allows for more granular control if using HTML.
Challenges
- Less visual and intuitive.
- Not recommended for sitewide changes.
3. Customizer or Theme Settings
Many modern WordPress themes include font size controls in their Customizer or dedicated theme options panel.
How to Use the Customizer
- Navigate to Appearance > Customize
- Look for Typography or Font Settings
- Find sections labeled Typography, General Settings, or something similar.
- Adjust Font Sizes
- Select the font sizes for body text, headings, menus, etc., using dropdowns or sliders.
Benefits
- Hassle-free and does not require code.
- Applies across your entire site.
Challenges
- Availability and options depend on your chosen theme.
- Some free themes may have limited typography controls.
4. Using a Plugin
If your theme doesn’t offer enough control, you can install a font or typography plugin to take charge of your font sizes.
Popular Plugins for Font Size Control
- Easy Google Fonts
- WP Google Fonts
- Advanced Editor Tools (TinyMCE)
- Custom Fonts
General Steps
- Install and Activate the Plugin
- Find the Plugin’s Control Panel
- Usually found in Appearance > Customize or a new menu in your dashboard.
- Adjust Font Sizes
- Most plugins let you change font sizes for different elements: paragraphs, headings, widget titles, etc.
- Save/Publish Changes
Benefits
- Adds more features, often compatible with most themes.
- Some plugins allow live preview.
Challenges
- Adding plugins may slightly slow your site.
- Some advanced features may require a paid version.
5. Custom CSS (Advanced)
For full control or if other methods fall short, adding custom CSS is the most flexible solution.
How to Add Custom CSS
- Go to Appearance > Customize
- Select Additional CSS
- Enter Your CSS Code
- Example to change all paragraph text:
p { font-size: 18px; } - To target headings:
h2 { font-size: 32px; } - Click “Publish” to Save Changes
Benefits
- Precise control over any text element.
- Can apply sitewide or target specific areas.
Challenges
- Requires CSS knowledge.
- Errors can affect site appearance.
6. Editing Page Builder Settings (Elementor, Divi, etc.)
If you use a page builder, changing font size is also easy.
Example: Elementor
- Open the Page with Elementor
- Click the Text Widget
- In the Editor’s Sidebar, Locate Typography
- Adjust the Size Slider
- Save or Update
Benefits
- Visual control.
- Granular adjustments per page or per section.
Challenges
- Only affects content built with the page builder.
Practical Tips & Best Practices
- Be Consistent: Maintain consistent font sizes across your site for a polished, professional look.
- Prioritize Readability: Standard body text is usually 16px–18px for optimal readability.
- Preview on All Devices: Test your font changes on mobile, tablet, and desktop to ensure a good user experience everywhere.
- Don’t Overuse Varied Sizes: Reserve larger fonts for key points or headings.
- Site Speed Awareness: Limit the number of plugins; more plugins can slow your site.
Cost Considerations
- Free Options: The Block Editor, themes with Customizer options, and plugins with basic features are generally free.
- Premium Themes/Plugins: Some advanced typography controls may require premium themes or paid plugins.
- DIY (CSS): Custom CSS changes are free, but you may need a developer if you’re not comfortable editing code.
Summary
Changing the font size in WordPress is accessible to all skill levels. Whether you’re a beginner using the Block Editor, someone who prefers old-school Classic Editor methods, or a power user editing CSS, there is a way to fine-tune your site’s typography. With a focus on readability and consistency, adjusting font size can notably improve your site’s design and user experience.
Frequently Asked Questions (FAQs)
1. Can I change the font size for just one word or sentence?
Yes! Use the Block Editor to select specific text and change its block’s font size. For even more control, switch to the “Text” or “HTML” view and wrap the text in a “ with a style tag.
2. How do I change font size across my entire website?
The best way is through your theme’s Customizer or by adding custom CSS targeting body text and headings. If your theme lacks options, consider a dedicated typography plugin.
3. Will changing font size affect my site’s mobile layout?
Changing font size can impact how your site looks on mobile devices. Always preview changes using WordPress’s built-in device preview or check your site on a mobile phone.
4. I don’t see font size options in my editor. What should I do?
If your editor’s typography controls are missing, try updating WordPress and your theme, activating Block Editor, or installing a typography plugin for more options.
5. Are there risks to changing font size with custom CSS?
A small error in custom CSS can affect your site’s appearance. Always preview your site after making CSS changes and back up your site or copy the previous CSS before editing.
By understanding these methods, you’ll be well-equipped to change font sizes in WordPress, enhancing both your site’s style and its readability for visitors.