TinyMCE in comment reply form showing toolbar but can't edit reply

Question

I have added the TinyMCE editor for comments using comment_form_defaults hook with wp_editor. It works great for the comment form, but when replying to the original comment, the new comment form shows the TinyMCE toolbar however I'm unable to type in the comment field. On inspection of the element TinyMCE has added an empty iFrame. I'm assuming there is a js initialization that needs to happen for it to fully load in the comment reply? Does anyone have any experience with this that can point me in the right direction to look into?

Thanks

Answer 1

It sounds like the TinyMCE editor is not properly initialized when you are replying to a comment. In order to fix this issue, you will need to add some JavaScript code to your WordPress theme that will initialize the TinyMCE editor when the comment reply form is displayed.

To do this, you can use the wp_editor function to create an instance of the TinyMCE editor, and then use the tinymce.init function to initialize the editor. Here is an example of how you could do this:

// First, create an instance of the TinyMCE editor
wp_editor('', 'my_editor_id', array(
    'tinymce' => array(
    'setup' => 'function (editor) {
        editor.on("init", function () {
            console.log("TinyMCE editor initialized");
            });
        }'
    )
));

// Then, initialize the TinyMCE editor using the tinymce.init function
tinymce.init({
selector: '#my_editor_id'
});

This code will create an instance of the TinyMCE editor with the specified id, and then initialize the editor using the tinymce.init function. You can then modify this code to fit your specific needs and integrate it into your WordPress theme.

Keep in mind that in order to use the TinyMCE editor in WordPress, you will need to include the TinyMCE JavaScript library in your theme. You can do this by enqueueing the wp-tinymce script using the wp_enqueue_script function