How to customize default wordpress editor?

2 comments

1. I was looking for a solution to place custom metabox above the default editor and i’ve found the solution to my old question (how to customize the default editor with the wp_editor)!

   The solution was to unset the default editor first. Then create another metabox to to place the content then use wp_editor to create new its new instance, simple isn’t it?

   add_action( 'add_meta_boxes', 'page_meta_boxes' );
   public function page_meta_boxes()
   {
   
       global $_wp_post_type_features;
               //ive defined my other metaboxes first with higher priority
       add_meta_box(
           $id     =   'page_heading_meta_box',
           $title  =   __('Heading'),
           $callback   = array(&$this,'render_page_heading_metabox'),
           $post_type  =   'page',
           $context    =   'normal',
           $priority   =   'core'
           );
       add_meta_box(
           $id     =   'page_description_meta_box',
           $title  =   __('Description'),
           $callback   = array(&$this,'render_page_description_metabox'),
           $post_type  =   'page',
           $context    =   'normal',
           $priority   =   'core'
           );
       //check for the required post type page or post or <custom post type(here article)  
       if (isset($_wp_post_type_features['article']['editor']) && $_wp_post_type_features['post']['editor']) {
           unset($_wp_post_type_features['article']['editor']);
           add_meta_box(
               'wsp_content',
               __('Content'),
               array(&$this,'content_editor_meta_box'),
               'article', 'normal', 'core'
           );
       }
       if (isset($_wp_post_type_features['page']['editor']) && $_wp_post_type_features['page']['editor']) {
           unset($_wp_post_type_features['page']['editor']);
           add_meta_box(
               'wsp_content',
               __('Content'),
               array(&$this,'content_editor_meta_box'),
               'page', 'normal', 'low'
           );
       }
       }
   

   In this way we have registered a new metabox called content . Now time to place the editor

           function content_editor_meta_box($post)
       {
           $settings = array(
               #media_buttons
               #(boolean) (optional) Whether to display media insert/upload buttons
               #Default: true
               'media_buttons' => true,
   
               #textarea_name
               #(string) (optional) The name assigned to the generated textarea and passed parameter when the form is submitted. (may include [] to pass data as array)
               #Default: $editor_id
               'textarea_name'=>'content',
   
               #textarea_rows
               #(integer) (optional) The number of rows to display for the textarea
               #Default: get_option('default_post_edit_rows', 10)
   
               #tabindex
               #(integer) (optional) The tabindex value used for the form field
               #Default: None
               'tabindex' => '4'
   
               #editor_css
               #(string) (optional) Additional CSS styling applied for both visual and HTML editors buttons, needs to #include <style> tags, can use "scoped"
               #Default: None
   
               #editor_class
               #(string) (optional) Any extra CSS Classes to append to the Editor textarea
               #Default:
   
               #teeny
               #(boolean) (optional) Whether to output the minimal editor configuration used in PressThis
               #Default: false
   
               #dfw
               #(boolean) (optional) Whether to replace the default fullscreen editor with DFW (needs specific DOM elements #and css)
               #Default: false
   
               #tinymce
               #(array) (optional) Load TinyMCE, can be used to pass settings directly to TinyMCE using an array()
               #Default: true
   
               #quicktags
               #(array) (optional) Load Quicktags, can be used to pass settings directly to Quicktags using an array()
               #Default: true
           );
           wp_editor($post->post_content,'content');
   
       }
   

   Now you can fully customize your editor! This is how it looks now. Hope it is useful for you too!
   

   Log in to Reply

2. You can do it by using the ‘tinymce’ key in the settings array, like this:

   $tinymce_options = array(
     'height' => "300",
     'theme' => "advanced",
     'plugins' => "table",
     // Theme options
     'theme_advanced_buttons1' => "bold,italic,link,|,formatselect,|,bullist,numlist,outdent,indent",
     'theme_advanced_buttons2' => "tablecontrols",
     'theme_advanced_buttons3' => "",
     'theme_advanced_toolbar_location' => "top",
     'theme_advanced_toolbar_align' => "left",
     'theme_advanced_statusbar_location' => "bottom",
     'theme_advanced_resizing' => true,
   );
   
   $settings = array(
     'textarea_name' => $name,
     'tinymce' => $tinymce_options
   );
   
   wp_editor( $content , $id, $settings );
   

   Log in to Reply