Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have a plugin that uses the wp_editor() function to load an instance of the TinyMCE editor.

However, the editor is affected by custom styling to make it look similar to the theme through the add_editor_style() function. While this may be great in giving the user an idea of how the content may look on the front-end, I do not want this as the content will only ever be displayed on the back-end.

Is there any way to load an instance of the WordPress editor without it being affected by custom styling?

share|improve this question
add comment

2 Answers 2

up vote 4 down vote accepted

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

share|improve this answer
add comment

I believe you want remove_editor_styles. Looks like it removes the theme support for editor styles.

remove_editor_styles();

If you run that on your plugin's backend page before the editor boots, it should solve the problem. There might be a parameter you can pass to the editor functions, or a hook, but removing the editor style support for the effected page was the first thing that came to my mind.

Untested and I haven't done much with editor styles but it seems pretty straightforward.

share|improve this answer
    
Thanks - just tested in in my plugin and it works like a charm! I wonder why I didn't think of it myself, as I have heard of this function before –  bungeshea Jan 16 '13 at 5:45
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.