How to Change the Default WordPress HTML Editor Font

February 4, 2011

Wordpress

The font in the WordPress HTML editor section is, well, dull. Courier and Arial are, in my opinion, lifeless and sometimes difficult to read. You can change the default font of the HTML editor quite easily.

If you are unfamiliar with the WordPress HTML editor font, here it is:


Changing the font is as easy as finding deals on Cyber Monday, thanks to a great tip from WP Recipes.

Go to your WordPress “Appearance” tab, click “Editor,” and look to the right for the “functions.php” file. Simply copy and paste the following into your functions.php file:

function change_editor_font(){
echo "<style type=’text/css’>
#editorcontainer textarea#content {
font-family: Georgia; monospace;
font-size:14px;
color:#333;
}
</style>";
} add_action("admin_print_styles", "change_editor_font");

Here’s what mine looked like:

Make sure you save the change. Here’s the new font in the HTML editor.

You can change the font family to whatever you wish. I chose Georgia, as you can see in the code above. I think it’s a nice change!

Note: Be aware that some custom themes may recommend you do not alter the functions.php file. Refrain from messing with the file or you may render an error on your blog.

, , , ,

About The Older Geek

Rebecca Mecomber has been a professional blogger and freelance writer since 2007. Her work and opinions on technology, travel, blogging, home improvement, and media regulation has appeared in The Wall Street Journal, Salon.com, USAToday, eHow.com, iMedia.com, Chron.com, SF Gate, and the Associated Press. She lives in New York with her husband, four kids and passel of pets.

View all posts by The Older Geek

One comment on “How to Change the Default WordPress HTML Editor Font

  1. I believe that you have an extra semicolon after “Georgia”.

vBulletin stats