我使用以下方法在Tinymce编辑器中插入按钮:
在函数中。php:
class myclaff
{
function __construct() {
add_action( \'admin_init\', array($this, \'load_tinymceee\') );
}
function load_tinymceee() {
if ( current_user_can( \'edit_posts\' ) && current_user_can( \'edit_pages\' ) ) {
//i have done as one plugin has only 1 button
add_filter(\'mce_external_plugins\', array($this, \'add_myplugin_first\'));
add_filter(\'mce_buttons_3\', array($this,\'register_mybutton_first\') );
add_filter(\'mce_external_plugins\', array($this, \'add_myplugin_second\'));
add_filter(\'mce_buttons_3\', array($this,\'register_mybutton_second\') );
}
}
//register first plugin,
function register_mybutton_first($buttons) {
array_push($buttons, \'|\', "UniqueButtonName1" );
return $buttons;
}
function add_myplugin_first($plugin_array) {
$plugin_array[\'firstplugin\'] = plugins_url(\'mypluginfolder/js/mybutton1.php\');
//or plugin_dir_url( __FILE__ ) . \'js/mybutton1.php\';
return $plugin_array;
}
//register second plugin,
function register_mybutton_second($buttons) {
array_push($buttons, \'-\', "UniqueButtonName2" );
return $buttons;
}
function add_myplugin_second($plugin_array) {
$plugin_array[\'secondplugin\'] = plugins_url(\'mypluginfolder/js/mybutton2.php\');
return $plugin_array;
}
} // class ends
//load class
$blablaa = new myclaff();
然后在“mypluginfolder/js/”中,我有这样一个mybutton1。php
(和mybutton2.php,代码类似)(我知道我需要输入tinymce按钮图像的正确url):
<?php
header("Content-type: application/x-javascript");
error_reporting(0);
define(\'WP_USE_THEMES\', false);
require(\'../../../../wp-blog-header.php\');
?>
(function() {
// START my customs
tinymce.create(\'tinymce.plugins.firstplugin\', {
init : function(ed, url)
{
// ---------- start adding buttons section---------------
ed.addButton(\'UniqueButtonName1\', {
title : \'the title of the button\',
image : url+\'/images/mybuttonimage.png\',
onclick : function()
{
// here starts the output
txt1 : //just a txt1 labeled block of code
{
var mynam = prompt("<?php echo "Please type your name";?>", "Something Default Name");
ed.selection.setContent(\'<center>\' + mynam + \'</center>\');
}
}
});
},
// end of the buttons section
createControl : function(n, cm) {
return null;
},
});
tinymce.PluginManager.add(\'firstplugin\', tinymce.plugins.firstplugin);
})();
但当我点击按钮时,我只会看到javascript弹出框,在这里我只能输入一个字段。代码是什么,实现了有多个字段、框、下拉菜单等。。点击按钮后?
SO网友:T.Todua
你的方法很复杂。。。下面是在TinyMCE中添加按钮的最简单函数:
(在functions.php中插入此代码):
add_action(\'admin_init\', function() {
if (current_user_can(\'edit_posts\') && get_user_option(\'rich_editing\') == \'true\') {
add_filter(\'mce_buttons_2\', \'register_buttonfirst\');
add_filter(\'mce_external_plugins\', \'add_pluginfirst\');
}
});
function register_buttonfirst($buttons) { array_push($buttons, "|", "shortcode_button1" ); return $buttons;}
function add_pluginfirst($plugin_array) {$plugin_array[\'MyPuginButtonTag\'] = plugin_dir_url( __FILE__ ).\'My_js_folder/1_button.php\';return $plugin_array;}
add_filter( \'tiny_mce_version\', \'my_refresh_mceeee1\'); function my_refresh_mceeee1($ver) {$ver += 3;return $ver;}
2) Create 1_button.php in target folder and insert this code (note, change "wp-load" and "ButtonImage.png" urls!!!)
<?php
header("Content-type: application/javascript");
require(\'../../../../wp-load.php\');
?>
(function() {
// START my customs
var abcd =location.host;
tinymce.create(\'tinymce.plugins.shortcodebuton_plugin2\', {
init : function(ed, this_folder_url)
{
// -------------------------
ed.addButton(\'shortcode_button1\', {
title : \'Show Level1 count\',
image : this_folder_url + \'/ButtonImage.png\',
onclick : function() {
var vidId = prompt("YouTube Video", "BLABLABLA");
ed.selection.setContent(vidId );
//ed.execCommand(\'mceInsertContent\', false, \'vidId\');
}
});
},
createControl : function(n, cm) { return null; },
});
tinymce.PluginManager.add(\'MyPuginButtonTag\', tinymce.plugins.shortcodebuton_plugin2);
})();
*另请注意,在单击编辑器工具栏中的按钮之前,首先,您可能需要在后期编辑器中单击光标,否则按钮可能无法工作。
(有关自定义HTML弹出窗口,请参见以下示例,而不是简单的提示:http://pastebin.com/raw/0BJZm7cd )