How to Change WordPress Editor Font in HTML Mode

by Nikolaenko Maxim · Published October 6, 2012 · Updated August 19, 2018

I've always been annoyed by the font of the visual editor, which is used by default in WordPress in HTML mode – Well, it doesn't fit technical texts.. Went through a bunch of plugins, and didn't find one, directly changing the font in the editor. Yet the search has borne fruit. – It turns out you can change the font at all without plugins.

To change the font in the WordPress editor, running in HTML mode, on that, which you like, you can apply a filter, using functions.php file. Paste this code into this file:

function change_html_editor_font(){
        echo "<style type='text/css'>
#editorcontainer textarea#content {
  font-family: Consolas, Monaco, monospace;
  font-size:14px;
  color:#101010;
}
</style>";
} add_action("admin_print_styles", "change_html_editor_font");

function change_html_editor_font(){

echo "<style type='text/css'>

#editorcontainer textarea#content {

font-family: Consolas, Monaco, monospace;

font-size:14px;

color:#101010;

}

</style>";

} add_action("admin_print_styles", "change_html_editor_font");

Then refresh the admin page – the font will change.

I advise you to look at the article on the official WordPress site about the function add_editor_style(‘custom-editor-style.css’). This feature allows you to change styles in WordPress' built-in visual editor..

The article was taken from the site: n-wp.ru

Online tutoring services. List of courses I teach

Basic web design course;
Site layout;
General course on CMS WordPress and continuation of the course on template development;
Website development in PHP.