添加新的自定义TinyMCE行

时间:2013-11-20 作者:mantis

我使用以下代码向WP编辑器添加了一些自定义tinymce:

PHP

add_action( \'init\', \'my_theme_buttons\' );
function my_theme_buttons() {
add_filter("mce_external_plugins", "my_theme_add_buttons");
add_filter(\'mce_buttons\', \'my_theme_register_buttons\');
}   
function my_theme_add_buttons($plugin_array) {
$plugin_array[\'buttons\'] = get_template_directory_uri() . \'/editor-buttons/buttons-plugin.js\';
return $plugin_array;
}
function my_theme_register_buttons($buttons) {
array_push( $buttons, \'arrowicon\' ); // &etc for each icon... name from buttons-plugin.js
return $buttons;
}
Javascript

(function() {
tinymce.create(\'tinymce.plugins.buttons\', {
        init : function(ed, url) {

        ed.addCommand(\'arrowicon\', function() {

            return_text = \'[arrow-icon]\';
            ed.execCommand(\'mceInsertContent\', 0, return_text);
        });

        // &etc for each icon...            

        ed.addButton(\'arrowicon\', {
            title : \'Arrow Icon\',
            cmd : \'arrowicon\',
            image : url + \'/arrow-right.png\'
        });

        // &etc for each icon...            
 },

  createControl : function(n, cm) {
        return null;
    },

});

// Register plugin
tinymce.PluginManager.add(\'buttons\', tinymce.plugins.buttons);
})();
一切正常,但我想在wp编辑器的第二行显示我的自定义图标,以便可以使用“厨房水槽”按钮进行切换(最好在第三行)。现在它们显示如下:

display in wordpress editor

1 个回复
最合适的回答,由SO网友:Lucio Coire Galibone 整理而成

你必须把过滤器挂到mce_buttons_2 而不是mce_buttons

add_filter(\'mce_buttons_2\', \'my_theme_register_buttons\');
这样,按钮将出现在第二行。

结束