The question:
I’m using the following code to produce a different TinyMCE bar to the default WordPress setup:
if (function_exists('wp_tiny_mce')) {
add_filter("mce_external_plugins", "add_myplugin_tinymce_plugin");
add_filter('mce_buttons', 'register_myplugin_button');
add_filter('teeny_mce_before_init', create_function('$a', '
$a["theme"] = "advanced";
$a["skin"] = "wp_theme";
$a["height"] = "75";
$a["width"] = "800";
$a["onpageload"] = "";
$a["mode"] = "exact";
$a["elements"] = "elm1, elm2";
$a["editor_selector"] = "mceEditor";
$a["plugins"] = "safari,inlinepopups,spellchecker";
$a["forced_root_block"] = false;
$a["force_br_newlines"] = true;
$a["force_p_newlines"] = false;
$a["convert_newlines_to_brs"] = true;
return $a;'));
wp_tiny_mce(true);
}
Can anyone tell me how to work a basic custom button in there?
All I need is a straightforward button which prints [ph_min] into the editor area.
I’ve tried using the following filters to no avail:
function register_tcustom_button($buttons)
{
array_push($buttons, "|", "highlight");
return $buttons;
}
function add_tcustom_tinymce_plugin($plugin_array)
{
$plugin_array['highlight'] = WP_PLUGIN_URL . '/sf-tinyMCE-custom-buttons/mce/min_max_buttons/editor_plugin.js';
return $plugin_array;
}
add_filter("mce_external_plugins", "add_tcustom_tinymce_plugin");
add_filter('mce_buttons', 'register_tcustom_button');
Is there any way of doing this, or will I have to use write a manual TinyMCE init which isn’t supported by WP?
The Solutions:
Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.
Method 1
I believe that you have already registered your shortcode. Now what we need to do is to initiate the Button. Once the shortcode is registered [ph_min]
let’s check if user can use rich editing:
function add_highlight_button() {
if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') )
return;
if ( get_user_option('rich_editing') == 'true') {
add_filter('mce_external_plugins', 'add_tcustom_tinymce_plugin');
add_filter('mce_buttons', 'register_tcustom_button');
}
}
add_action('init', 'add_highlight_button');
Now lets register the button
function register_tcustom_button( $buttons ) {
array_push( $buttons, "|", "highlight" );
return $buttons;
}
Now let’s register TinyMCE plugin
function add_tcustom_tinymce_plugin( $plugin_array ) {
$plugin_array['mylink'] = get_bloginfo( 'template_url' ) . '/script/mybuttons.js';
return $plugin_array;
}
And this is for the JS file called from the previous function:
(function() {
tinymce.create('tinymce.plugins.highlight', {
init : function(ed, url) {
ed.addButton('highlight', {
title : 'Highlight',
image : url+'/yourlink.png',
onclick : function() {
ed.selection.setContent('[ph_min]');
}
});
},
createControl : function(n, cm) {
return null;
},
});
tinymce.PluginManager.add('highlight', tinymce.plugins.highlight);
})();
That’s about it.
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0