Load visual editor without custom styling

While @s_ha_dum’s solution works fine on a custom plugin page, it will fail if you use TinyMCE on a post editor page after the first editor instance has been called, because it would either affect all editors or at least the editors later on the same page. TinyMCE parses custom styles into its settings during the first run only.

How to remove the custom styles for one editor only?

Let’s say we replace the excerpt box with a rich editor in a class with static methods only:

wp_editor(
    self::unescape( $post->post_excerpt ),
    'excerpt', // $editor_id
    array (
    'textarea_rows' => 15
,   'media_buttons' => FALSE
,   'teeny'         => TRUE
,   'tinymce'       => TRUE
,   'first_init' => TRUE
    )
);

To remove the custom styles for just one special editor ID, we can filter teeny_mce_before_init if we have set 'teeny' => TRUE and tiny_mce_before_init otherwise.

See _WP_Editors::editor_settings():

// For people who really REALLY know what they're doing with TinyMCE
// You can modify $mceInit to add, remove, change elements of the config before tinyMCE.init
// Setting "valid_elements", "invalid_elements" and "extended_valid_elements" can be done through this filter.
// Best is to use the default cleanup by not specifying valid_elements, as TinyMCE contains full set of XHTML 1.0.
if ( $set['teeny'] ) {
    $mceInit = apply_filters('teeny_mce_before_init', $mceInit, $editor_id);
} else {
    $mceInit = apply_filters('tiny_mce_before_init', $mceInit, $editor_id);
}

In this example it is teeny_mce_before_init, and we need a simple helper method:

public static function no_custom_css( $settings, $editor_id )
{
    'excerpt' === $editor_id and $settings['content_css'] = '';
    return $settings;
}

Now we register that as callback before we call wp_editor():

add_filter( 'teeny_mce_before_init', array ( __CLASS__, 'no_custom_css' ), 10, 2 );

That’s all. Only editors with our ID will get no custom styles now. No untestable side effect, our code stays compatible with other code in all situations.

enter image description here

Leave a Comment