tinymce is not defined when not using wp_editor

Question

I am using jQuery tinyMCE to populate dynamically generated text areas with tiny MCE editors.

When I use the WordPress wp_editor function before I call the jQuery version, I have no issues. If I do not, I get;

Uncaught ReferenceError: tinymce is not defined

As a dreadful hack, I have used;

wp_editor('hacky', 'hackhack');

wp_register_script('admin_js', get_template_directory_uri() . '/assets/js/admin.min.js', array());
wp_enqueue_script('admin_js');

Which allows the jQuery TinyMCE to work. I wish to eliminate this. Thinking WP wasn't loading the jQuery version (and not knowing a good way to get the path of WP-includes) I used;

?><script type="text/javascript"src="//cdnjs.cloudflare.com/ajax/libs/tinymce/4.1.7/jquery.tinymce.min.js"></script><?php

wp_register_script('admin_js', get_template_directory_uri() . '/assets/js/admin.min.js', array());
wp_enqueue_script('admin_js');

But this doesn't seem to be the issue. It seems that the WP version loads the required files I need - except I do not know what files I need.

Answer 1

With help from a colleague, we dug through class-wp-editor.php

Here are the necessary scripts to initialise jQuery tinyMCE if wp_editor has not been used beforehand (which calls these scripts).

// Get the necessary scripts to launch tinymce
$baseurl = includes_url( 'js/tinymce' );
$cssurl = includes_url('css/');

global $tinymce_version, $concatenate_scripts, $compress_scripts;

$version = 'ver=' . $tinymce_version;
$css = $cssurl . 'editor.css';

$compressed = $compress_scripts && $concatenate_scripts && isset($_SERVER['HTTP_ACCEPT_ENCODING'])
    && false !== stripos($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip');

if ( $compressed ) {
    echo "<script type='text/javascript' src='{$baseurl}/wp-tinymce.php?c=1&amp;$version'></script>\n";
} else {
    echo "<script type='text/javascript' src='{$baseurl}/tinymce.min.js?$version'></script>\n";
    echo "<script type='text/javascript' src='{$baseurl}/plugins/compat3x/plugin.min.js?$version'></script>\n";
}

add_action( 'wp_print_footer_scripts', array( '_WP_Editors', 'editor_js' ), 50 );
add_action( 'wp_print_footer_scripts', array( '_WP_Editors', 'enqueue_scripts' ), 1 );

wp_register_style('tinymce_css', $css);
wp_enqueue_style('tinymce_css');

This will create a dynamic tinyMCE editor without the tabs to switch between visual / text, nor the media upload functionality. I had to create these buttons manually as well as the respective jQuery for each.

Edited in the required css the editor uses as well.

EDIT:

More elegant solution but with less fallback (no versioning)

$js_src = includes_url('js/tinymce/') . 'tinymce.min.js';
$css_src = includes_url('css/') . 'editor.css';

// wp_enqueue doesn't seem to work at all
echo '<script src="' . $js_src . '" type="text/javascript"></script>';

wp_register_style('tinymce_css', $css_src);
wp_enqueue_style('tinymce_css');

Answer 2

For what it's worth - I recently ran into this problem with the editor disappearing with wp 4.1 after a site migration. The issue happened to be that "accessibility mode" (The link under screen options in the widget editor) was turned on.

Answer 3

My problem was wordpress was not including the tinymce script tag because user_can_richedit() was returning false (I did not investigate why. My user is an admin, and it was previously working on a different install, so maybe some setting controls it?). In any case, you can filter the return value of user_can_richedit() to get wordpress to include the tinymce scripts and then tinymce will be defined.

add_filter('user_can_richedit', '__return_true');

Answer 4

I had an error after I called wp_editor() saying:

j is undefined

It turned out that the option name I was using had a dot in the name (my_plugin_name_customer.subscription.updated) and it was breaking the editor. I replaced the dot with underscore and it fixed my problem.

Answer 5

Anyone that has created their admin user from PhpMyAdmin, and comes across this issue - it may be because you have not copied the user_meta row for rich text editing. Simply check, and uncheck the "Disable the visual editor when writing" option in your user profile to test if this will fix your issue.