Make WordPress Core

Opened 12 years ago

Closed 12 years ago

#19437 closed enhancement (fixed)

Pass post type as a class to TinyMCE init

Reported by: markjaquith's profile markjaquith Owned by: azaozz's profile azaozz
Milestone: 3.4 Priority: normal
Severity: normal Version:
Component: TinyMCE Keywords:
Focuses: Cc:

Description

If we pass the post type as a class to TinyMCE, editor-styles.css can target rules to specific post types which may be displayed differently.

<?php wp_editor($post->post_content, 'content', array('dfw' => true, 'tabindex' => 1, 'tinymce' => array( 'body_class' => 'post-type-' . $post_type ) ) ); ?>

Attachments (1)

19437.child-editor-style.patch (1.2 KB) - added by SergeyBiryukov 12 years ago.

Download all attachments as: .zip

Change History (18)

#1 @nacin
12 years ago

+100. Ran into this earlier today.

#2 @azaozz
12 years ago

  • Component changed from General to Editor
  • Milestone changed from Awaiting Review to Future Release
  • Type changed from defect (bug) to enhancement

Been looking into something similar recently too. However to set anything into TinyMCE's iframe it has to go through JS (as it's 100% JS generated). So we need a JS "helper" function to modify classes (and IDs?) in the iframe document.

Seems the best way to do this would be to handle it from one of our custom TinyMCE plugins: we can pass extra classes as MCE init setting and then apply them from the plugin.

Also it seems we need to make editor-style.css more structured/predictable. There are styles/selectors that shouldn't go in there and all selectors should be exactly the same as in the theme's style.css.

Last edited 12 years ago by azaozz (previous) (diff)

#3 @johnjamesjacoby
12 years ago

Just dropping a note while it's on my mind, this will become increasingly more important as plugins (like bbPress/BuddyPress) start including wp_editor() in places outside of the traditional post editor; within the theme, for example.

#4 @gluten
12 years ago

It would also be useful to have a class added with the wp_editor() $editor_id to allow for unique styling of TinyMCE editors.

#5 @SergeyBiryukov
12 years ago

  • Keywords needs-patch added

#6 @azaozz
12 years ago

  • Component changed from Editor to TinyMCE
  • Keywords needs-patch removed
  • Milestone changed from Future Release to 3.4

3.4 as part of the editor enhancements.

#7 @azaozz
12 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In [19912]:

Add the editor ID and the post type (when available) as classes to the TinyMCE's body, fixes #19437

#8 follow-up: @jamescollins
12 years ago

For security, do we need to esc_attr() the $body_class variable?

That's what we do at the end of the get_body_class() function (http://core.trac.wordpress.org/browser/trunk/wp-includes/post-template.php#L545).

#9 @nacin
12 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

#11 in reply to: ↑ 8 @azaozz
12 years ago

Replying to jamescollins:

For security, do we need to esc_attr() the $body_class variable?

Don't see a point in escaping the editor ID or the post_type strings.

That's what we do at the end of the get_body_class() function (http://core.trac.wordpress.org/browser/trunk/wp-includes/post-template.php#L545).

Right, seems that's not needed there either, the HTML class attribute allows all UTF-8 chars with very few exceptions.

#12 @azaozz
12 years ago

In [20054]:

Improve adding more css classes to the editor body, add "rtl", "ie7", "ie8", "ie9" so they can be targeted in editor-style.css, see #19437

#13 @azaozz
12 years ago

In [20059]:

Don't pass non-existing rtl stylesheet to TinyMCE, update phpdoc for add_editor_style(), see #19437

#14 follow-up: @SergeyBiryukov
12 years ago

[20059] brings back #18457. 19437.child-editor-style.patch is an attempt to fix that.

#15 in reply to: ↑ 14 @azaozz
12 years ago

Replying to SergeyBiryukov:

Wouldn't that add the child theme's stylesheet before the parent theme's? At first look in the patch the parent theme loop is after the child theme loop:

if ( is_child_theme() ) { 
  $template_uri = get_template_directory_uri(); 
  $template_dir = get_template_directory(); 

  foreach ( $editor_styles as $file ) { 
    ...
  }
}

foreach ( $editor_styles as $file ) { 
  if ( $file && file_exists( "$style_dir/$file" ) ) 
    ...
} 
Version 1, edited 12 years ago by azaozz (previous) (next) (diff)

#16 @azaozz
12 years ago

In [20342]:

Fix adding of parent theme's editor-style before child theme's, props SergeyBiryukov, see #19437

#17 @azaozz
12 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

Seems to work properly

Note: See TracTickets for help on using tickets.