Today I am going to explain how to add WYSIWYG editor to category description. Sometimes you want detailed HTML text as a description in category page so you can mostly prefer to use the plugin but which is not good to use the plugin because we can do it with small piece of code.
In this article, I will explain function which enables the WordPress TinyMCE editor on the Edit Category page of the admin panel and you can add/edit the descriptions the same way you add/edit posts content.
Let’s understand by code:
First of all, we use filter hook which edit category form and replace text area with an editor.Then after I have used action hook which is used to set style sheet of an editor.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | function edit_cat_description($category) { $tag_extra_fields = get_option(description1);?> <tr class="form-field"> <th scope="row" valign="top"><label for="description"><?php _ex('Description', 'Taxonomy Description'); ?></label></th> <td> <?php $settings = array('wpautop' => true, 'media_buttons' => true, 'quicktags' => true, 'textarea_rows' => '15', 'textarea_name' => 'description' ); wp_editor(html_entity_decode($category->description , ENT_QUOTES, 'UTF-8'), 'description1', $settings); ?> <br /> <span class="description"><?php _e('The description is not prominent by default, however some themes may show it.'); ?></span> </td> </tr> </table> <?php } add_action( 'admin_print_styles', 'category_tinymce_css' ); function category_tinymce_css() { ?> <style type="text/css"> .quicktags-toolbar input{float:left !important; width:auto !important;} </style> <?php } add_action('category_add_form_fields','add_cat_description'); function add_cat_description($tag) { $tag_extra_fields = get_option(description1);?> <table class="form-table"> <tr class="form-field"> <th scope="row" valign="top"><label for="description"><?php _ex('Description', 'Taxonomy Description'); ?></label></th></tr><tr class="form-field"> <td> <?php $settings = array('wpautop' => true, 'media_buttons' => true, 'quicktags' => true, 'textarea_rows' => '15', 'textarea_name' => 'description' ); wp_editor(html_entity_decode($tag->description , ENT_QUOTES, 'UTF-8'), 'description1', $settings); ?> <br /> <span class="description"><?php _e('The description is not prominent by default, however some themes may show it.'); ?></span> </td> </tr> </table> <?php } add_action('admin_head', 'taxonomy_tinycme_hide_description'); function taxonomy_tinycme_hide_description() { global $pagenow; //echo $pagenow;exit; //only hide on detail not yet on the overview page. $('#description, textarea#tag-description').closest('.form-field').hide(); }); </script><?php endif; } |
That’s it. Place above code into your theme’s function.php file and run the code into browser :).
Read:
Convert RGB to Hex HTML code in PHP
The DocType In HTML
Clean HTML content in PHP
Hope this helps someone else out.As always, thanks for reading. Don’t Forget to Follow us on Twitter or Subscribe us to Get the Latest Updates.
Comments (6)