Add WordPress Core CSS into editor-style.css

Question

I am using a custom child theme (from Parabola, Cryout Creations, lastest version), but it seems that the editor-style.css file is not up-to-date. Rather than rewriting everything, I would like it to contain every css used on the front-end, so TinyMCE looks as close as the published page/article (this is important).

In order to do that, I have created a new editor-style.css file in my child theme, so it overrides the not-up-to-date file. So far, it includes the styles.css file from my theme, but it lacks a lot of CSS from WordPress Core (the one on line 60 on the index file : http://nouveau.domaineloupia.com).

So, how to add this “core CSS” to my editor-style.css file ? And would it be the best way to do this ? I have seen many stuff talking about the add_editor_style function, but I do not know if I could use it to do what I want nor how.

how can i do this?

Answer 1

To add styles that affect TinyMCE you need to do the following:

add_action( 'admin_init', 'editor_styles' );
function editor_styles() {
       add_editor_style( get_stylesheet_directory_uri() . 'editor-style.css' );
}

Basically it will load a editor-style.css file located in the root of your child theme.