How to customize default wordpress editor? How to customize default wordpress editor? wordpress wordpress

How to customize default wordpress editor?


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!enter image description here


You can customize the editor (TinyMCE) with a filter, as shown here. Code snippet attached:

function myformatTinyMCE($in){ $in['plugins']='inlinepopups,tabfocus,paste,media,fullscreen,wordpress,wpeditimage,wpgallery,wplink,wpdialogs,wpfullscreen'; $in['wpautop']=true; $in['apply_source_formatting']=false; $in['theme_advanced_buttons1']='formatselect,forecolor,|,bold,italic,underline,|,bullist,numlist,blockquote,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,unlink,|,wp_fullscreen,wp_adv'; $in['theme_advanced_buttons2']='pastetext,pasteword,removeformat,|,charmap,|,outdent,indent,|,undo,redo'; $in['theme_advanced_buttons3']=''; $in['theme_advanced_buttons4']=''; return $in;}add_filter('tiny_mce_before_init', 'myformatTinyMCE' );

This code should be placed in your theme's functions.php file. You may want to print_r( $in ) to see all the keys that are passed (I've omitted some of them here because I don't believe the page that I linked to above is up-to-date). You can browse the latest source here. You'll find the filters you're looking for in function public static function editor_settings($editor_id, $set)

Also, you may also want to make sure that this only happens for your baner post_type, as this will affect all instances of the editor that are created.


You can try this Editor which you can add additional fields also it is simple to use and install