editor-style.css Functionality

Question

Scenario: I have a client who has difficulty understanding that the font styling he sees in the WordPress dashboard for his posts is not necessarily the styling that will show on the front site. Overuse of the TinyMCE plugin, has resulted in every text block tag having a span inside it, as he attempts to make the editor match what is already happening on the front side because of a child theme. The text formatting is not uniform on the site because of this practice.

Goal: I would like to make the editor font (Georgia) match the font that he wants on the front (and which is happening on the front). Also, I would like to change the Format menu to match the child theme CSS that we agreed on.

Setup:

1. The theme he is using does not have an editor-style.css. I have added one, but my research has resulted in a jumble of information that is not a clear set of instructions.
2. The font sizes available to him are in pt, not px or any other choice.
3. He is using the Classic Editor.

Do I need to connect the editor-style.css file to the theme with an entry in functions.php?

Do I need to use specifiers that include editor names?

I did find one similar question in my search, but it was for the title field.

Answer 1

The correct way to enqueue an editor stylesheet is as follows:

add_action( 'after_setup_theme', 'generate_child_setup' );
    function generate_child_setup() 
    {
        add_editor_style( 'path/to/editor-style.css' );
    }

I pulled that snippet from here: https://generatepress.com/forums/topic/how-to-call-editor-style-css-from-child-theme/#post-149083

I guess the intuitive approach for most would be to enqueue it in the admin but that wouldn't apply it correctly. I believe add_editor_style() ensures it's added to the actual content editor.

Here's the WordPress Codex page for it: https://developer.wordpress.org/reference/functions/add_editor_style/