Sometime back I installed Linux Mint 16 (previously Windows) on one of the system we use for publishing articles here, on TechVorm. Although initially it was a tough ask from us to get acquainted to Linux working environment but gradually everything worked out well. More recently when talking to Jatinder (our Senior Editor) a problem of different sort was pointed out, I was asked if it was possible to increase the font size in wordpress visual editor in WordPress since the current (default) font size of 13 px seemed too small on a 21″inch screen.
My first place to look out for a solution was WordPress plugin repository but the plugins I found were not compatible with the latest release of WordPress. Not wasting anymore time, I found a quick fix to deal with this. Before getting started with what I did, I am sharing a screen shot of the visual editor before making the changes.
Moving on, I’ll be directly editing the core WordPress files in order to change font size of WordPress visual editor. You need to open the CSS file wp-content.css by opening the following location:
/wp-includes/js/tinymce/skins/wordpress/wp-content.css
Note 1: The path of wp-content.css is applicable to WordPress 3.9, it might be different for other version but the logic behind it remains the same i.e alter the CSS file to get the job done 😉
Make sure to make a backup of this file before attempting to make any alterations in it (Just in case). Now, search for the following code snippet within wp-content.css file:
/* Additional default styles for the editor */
body {
font-family: Georgia, “Times New Roman”, “Bitstream Charter”, Times, serif;
font-size: 13px;
line-height: 19px;
color: #333;
margin: 10px;
}
Change the font-size parameter to your own liking. I increased it marginally to 15px but you are free to change it as per your requirement. And make sure that you increase the line-height as well in order to maintain the overall readability in Visual Editor.
After making these changes, save the file (and upload it back to server in case you made the changes locally). Clear cache of your WordPress installation as well as that of your web browser and the changes should be visible now! Here’s the screen shot after making the changes:
Note 2: This isn’t the most sophisticated method but it gets the job done without burdening the website with yet another plugin. And also in case of future updates, you might have to make the changes all over again if this files is overwritten.
