Changing the Font Size of WordPress’s Visual Editor

The font size of WordPress’s visual editor is too small for me on my screen display. The default font size is 13px which is hard for my eye on my screen. There are two ways to change the default font size in the visual editor. One is changing WordPress’s css file for the editor while the other is using a plugin.

Method 1: Change WordPress’s CSS file

This is the most direct way. This method will apply to all the contributors’ editors.

The CSS file for the visual editor’s font is: wp-includes/js/tinymce/themes/advanced/skins/wp_theme/content.css in WordPress’s installation directory.

First download this file and open if with an text editor that you like. Then find these lines:

body.mceContentBody {
    font: 13px/19px Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
    padding: 0.6em;
    margin: 0;
}

The font here specifies the font size of WordPress’s visual editor. If we want to change the font size to 16px, just change that line to:

font: 16px/19px Georgia, "Times New Roman", "Bitstream Charter", Times, serif;

Then save this CSS file and uploaded to the hosting server. It’s done!

Method 2: Use WordPress plugin

This method will not modify WordPress’s files. But it requires us to install a plugin: Visual Editor Font Size

After installing this plugin, you will find a “Visual Editor Font Size” tool bar under the editor (maybe a little far away from it). You can click the “+” and the “-” button to make the font larger or smaller.