After stumbling on a WordPress plugin called Anyvar I found it was extremely useful. However, one thing I really did not like about the plugin was the fact that a user had to use code to type anything in unless it was some simple text.
After some thought I decided to add the same WYSIWYG (What You See Is What You Get) editor that WordPress uses to the plugin to allow everyone to be able to add text and even more useful is the ability to add images. Now a user can add images to the plugin just as you would do when editing a page or a post.
How did I add the WYSIWYG editor to the plugin?
Generally to add a visual editor with the media uploader to a plugin where there is a text area for editing then it is a simple process with just a few lines of code:
/** In plugin file **/
add_action('admin_print_scripts', 'add_thejs' );
add_action('admin_print_styles', 'add_thecss' );
function add_thecss()
{
wp_enqueue_style('thickbox');
}
function add_thejs()
{
if ( user_can_richedit() ){
wp_enqueue_script('editor');
wp_enqueue_script('media-upload');
add_action('admin_head', 'wp_tiny_mce');
}
}
/** Then wherever the textarea is replace it with the following **/
<?php the_editor('Some content here','content'); ?>
It is good to note that if you don’t use the id of content then the visual display will not be selected automatically it will select the HTML view first.
It is quite amazing that all you need are these few lines of code to enable the use of the editor. The code i used was slightly different for the Anyvar plugin as the following needs to be added as an array:
add_action("admin_print_styles-$page", array(&$this,'anyvar_css')); // Add required css file(s)
add_action("admin_print_scripts-$page", array(&$this,'anyvar_head')); // Add required JS file(s)
Hopefully the code above to add the editor is straight forward enough to add to your plugin.
Just to give you a quick overview of what it does here is a quick run down.
The add actions are how the functions are called then in each function the CSS or the Javascript is added in turn.
One thing I added was the:
if ( user_can_richedit() ){
This then allows you to only show the editor if the user has the rights to use one.
I hope this is useful to someone and I hope that Matt from devspace includes it in the next release.
Here is the my updated file for you to download: Anyvar Updated – You may need to right click and save file as.
You will need to change the .txt extension to be .php
*Please note that although I have tested this on a few sites you should make sure you test it and backup before using it on a live website.
