For a WordPress user, the dashboard is where they end up spending the most time. Therefore it makes sense that you customize it to something that you find appealing or even comforting.
One way to personalize is to change WordPress admin font across the dashboard. Something that you like and makes your dashboard uniquely ‘you’.
We all have favorite fonts. For example, we’ve seen clients use all sorts of crazy, fun fonts across their dashboards. Here’s one:
But it's not just for fun. Changing the admin font can also make a big difference in creating a more personalized, branded, or easier-to-read workspace.
Whether aiming for a sleek, professional look or simply wanting something that reflects your style, customizing the WordPress admin font is easier than you might think.
In this guide, we’ll explore three ways to change the WordPress admin font: using a plugin like WP Adminify, applying custom CSS, or modifying your theme’s functions file. Whether you’re a beginner or a seasoned WordPress user, there’s an option here for you!
Let’s dive in.
Option 1: Using WP Adminify to Change WordPress Admin Font
The easiest and most user-friendly way to change the WordPress admin font is by using a plugin like WP Adminify.
WP Adminify is a powerful dashboard customizer that lets you change the WordPress admin font without much fuss.
Here’s how you can do it:
Step 1: Install and Activate WP Adminify
1. Go to your WordPress dashboard and navigate to Plugins > Add New.
2. Search for “WP Adminify.”
3. Click Install Now, then Activate once the installation is complete. Check this installation guide if you require a more detailed breakdown of the plugin installation process.
Step 2: Navigate to Adminify Customization Settings
1. After activation, go to WP Adminify > Customize Section in your WordPress dashboard.
2. Enable the Adminify UI, which will in turn enable the “Body font” option.
Step 3: Customize the Admin Font
In the Body Font settings, you can:
Select a font family from the dropdown list (includes Google Fonts and recommendations for safe web fonts).
Adjust the font size, weight, and style to fit your preferences.
Preview font changes in real time as you adjust the settings.
Save your changes when you’re satisfied.
Step 4: Review Your Dashboard
Once saved, the admin dashboard will instantly reflect the new font and styling. Here’s what it looks like for the “Times New Roman” font:
Navigate around the dashboard to ensure everything looks as intended.
Why Choose WP Adminify?
WP Adminify doesn’t just let you change WordPress admin font—it also provides a host of other options to help you create a dashboard that’s branded and user-friendly.
From productivity boosters like custom admin menus to security options such as login redirects and limits, WP Adminify is a one-stop solution for a personalized and optimized WordPress admin experience.
If you’re looking for a simple, no-code solution for dashboard customization, productivity, security, and a whole bunch of other things inside one plugin, WP Adminify is the way to go!
Check out the free version or just go to our live demo for a faster test run.
Option 2: Changing the Admin Font with Custom CSS
If you prefer a manual approach, using Custom CSS is another effective way to change the WordPress admin font.
This method is ideal for users comfortable with a bit of coding and provides full control over font customization.
Step 1: Access the WordPress Customizer or Theme Editor
1. Navigate to your WordPress dashboard.
2. Go to Appearance > Customize and open the Additional CSS panel.
3. Alternatively, go to Appearance > Theme File Editor, but note that this requires caution to avoid breaking your site. Remember, this doesn’t work for recent Gutenberg themes. It will work for the Twenty-Twenty One or older themes.
Bonus tip: WP Adminfiy also lets you add custom CSS. Just go to the the Code Snippets section > Admin Scripts tab > Paste your code in the Custom CSS box.
Step 2: Add Custom CSS Code for Admin Fonts
To target the WordPress admin dashboard, you need to modify the admin.css file. Here’s how to do it:
1. Open your theme’s functions.php file and enqueue a custom CSS file for the admin dashboard.
function custom_admin_fonts() {
wp_enqueue_style('custom-admin-fonts', get_template_directory_uri() . '/admin.css');
}
add_action('admin_enqueue_scripts', 'custom_admin_fonts');2. Create an admin.css file in your theme folder and add the following CSS to specify the desired font:
body, #wpadminbar, #adminmenu, .wrap {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
}
Step 3: Save and Verify Changes
1. Save the changes to your files.
2. Refresh your WordPress admin dashboard to see the new font applied.
Things to Keep in Mind:
1. Font Availability
Ensure the font you’re using is either a web-safe font or hosted through a font service like Google Fonts. To use a Google Font, include this in your admin.css:
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');2. Backup First: Always back up your theme files before making changes to avoid accidental data loss.
When to Use This Method?
- If you need complete control over font placement and styles.
- If you want to create a unique and lightweight setup without relying on plugins.
While this method requires a bit more effort, it’s highly customizable and great for developers or advanced users!
Option 3: Changing the Admin Font via Functions.php
Another straightforward method for changing the WordPress admin font is by adding a few lines of code to your functions.php file.
This approach is less involved than creating a custom CSS file and works well for quick adjustments.
Step 1: Access the Functions.php File
1. Go to your WordPress dashboard.
2. For older themes(Twenty-Twenty One or older), navigate to Appearance > Theme File Editor.
3. For the newer Gutenberg themes, you need to access the functions.php file through the cPanel or FTP.
Step 2: Add Code to Enqueue Custom Fonts
Insert the following code snippet into the functions.php file to load and apply a custom font to the admin area:
function custom_admin_font() {
echo '<style>
body, #wpadminbar, #adminmenu, .wrap {
font-family: "Roboto", sans-serif;
font-size: 14px;
}
</style>';
}
add_action('admin_head', 'custom_admin_font');This code specifies the Roboto font, but you can replace it with any other font of your choice.
Step 3: Use Google Fonts for More Variety
To use Google Fonts, first include the font in your code. For example:
function custom_admin_font() {
echo '<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">';
echo '<style>
body, #wpadminbar, #adminmenu, .wrap {
font-family: "Roboto", sans-serif;
font-size: 14px;
}
</style>';
}
add_action('admin_head', 'custom_admin_font');Step 4: Save and Check the Dashboard
1. Click Update File to save your changes.
2. Refresh your WordPress admin dashboard to see the new font applied.
Benefits of This Method
- Quick and Easy: Great for making simple changes without extra files or plugins.
- Customizable: You can adjust the font size, weight, and family directly in the code.
Important Notes
- Backup Functions.php: Always back up your theme’s functions.php file before making changes to prevent accidental errors.
- Impact on Updates: Changes made to a theme’s functions.php file may be lost if the theme is updated. To avoid this, use a child theme or a site-specific plugin for custom code.
This method is perfect for users who are comfortable editing code and need a fast way to adjust the admin font.
Conclusion
Changing the WordPress admin font is a simple yet impactful way to enhance your dashboard's usability and align it with your brand.
Whether you prefer the flexibility of a plugin like WP Adminify, the precision of custom CSS, or the quick edits via functions.php, you have plenty of options to achieve the perfect look.
Choose the method that suits your skill level and needs, and enjoy a more personalized WordPress experience.
Customize With Absolute Freedom
Harness the power of advanced dashboard customization with WP Adminify.
