如何在WP中向TinyMCE添加多个按钮？

Question

我已经按照Nettuts上的教程了解如何向TinyMCE添加自定义按钮(http://net.tutsplus.com/tutorials/wordpress/wordpress-shortcodes-the-right-way/)

它工作得很好,所有,但我想添加许多按钮,我想知道是否有一个聪明的方法来做到这一点,而不必一遍又一遍地复制所有代码.

这是我用来添加按钮的代码:

add_shortcode("quote", "quote");  
function quote( $atts, $content = null ) {  
    return '<div class="right text">"'.$content.'"</div>';  
}

add_action('init', 'add_button');  
function add_button() {  
   if ( current_user_can('edit_posts') &&  current_user_can('edit_pages') )  
   {  
     add_filter('mce_external_plugins', 'add_plugin');  
     add_filter('mce_buttons_3', 'register_button');  
   }  
}  
function register_button($buttons) {  
   array_push($buttons, "quote");  
   return $buttons;  
}  
function add_plugin($plugin_array) {  
   $plugin_array['quote'] = get_bloginfo('template_url').'/js/customcodes.js';  
   return $plugin_array;  
}  

然后我使用以下代码创建customcodes.js文件:

(function() {  
    tinymce.create('tinymce.plugins.quote', {  
        init : function(ed, url) {  
            ed.addButton('quote', {  
                title : 'Add a Quote',  
                image : url+'/image.png',  
                onclick : function() {  
                     ed.selection.setContent('[quote]' + ed.selection.getContent() + '[/quote]');  

                }  
            });  
        },  
        createControl : function(n, cm) {  
            return null;  
        },  
    });  
    tinymce.PluginManager.add('quote', tinymce.plugins.quote);  
})();

再说一次,如何添加多个按钮而不必为每个新按钮执行所有这些代码？

谢谢:)塞巴斯蒂安

Answer 1

如果我正确理解你的问题,你想添加更多按钮而不必复制register_button($buttons)和add_plugin($plugin_array)功能？

我知道这是一个老问题,但有一种方法可以在不重复功能的情况下完成.

只需进入你的customcodes.js和init : function(ed, url)创建新按钮,就像你做第一个一样,所以它看起来像这样:

init : function(ed, url) {  
             /* your original button */
            ed.addButton('quote', {  
            title : 'Add a Quote',  
            image : url+'/image.png',  
            onclick : function() {  
                 ed.selection.setContent('[quote]' + ed.selection.getContent() + '[/quote]'); 
            }  
        }); 
            /* your second button */
            ed.addButton('singlequote', {  
            title : 'Add a Single Quote',  
            image : url+'/image.png',  
            onclick : function() {  
                 ed.selection.setContent('[singlequote]' + ed.selection.getContent() + '[/singlequote]'); 
            }  
        }); 
} 

等等,你需要的按钮很多.

之后再回到你的register_button($buttons)功能并更新array_push().

所以,当你只有一个按钮添加时,它看起来像这样:

function register_button($buttons) {  
array_push($buttons, "quote");  
return $buttons;  }

现在您创建了新按钮,此功能将如下所示.

function register_button($buttons) {  
array_push($buttons, "quote", "singlequote");  
return $buttons; }  

依此类推,取决于您添加了多少新按钮.

您无需复制函数,也无需添加新操作和过滤器来向tinyMCE添加新按钮.

您只需在tinyMCE插件中创建新按钮,并列出您在其中创建的按钮的名称 array_push().

也许你不知道array_push()接受多个推送值. 这是它在php.net上的文档

Answer 2

除了在现有函数中添加额外的按钮代码之外，我认为没有办法完成您正在尝试的操作。

不幸的是，这是添加按钮的代码，因此如果您想添加另一个按钮，则必须再次添加代码。

如果您想要添加的按钮几乎在所有方面都相似，那么您可能可以通过执行 aforeach {}和 aswitch(){case '':}来输入数据，但除非所有按钮都执行相同的操作，否则这似乎有点多余。

如果您想要做的只是保持 function.php 文件整洁，那么我建议将每个按钮放在一个单独的 .php 文件中，该文件的名称与主函数相同，位于名为 inc 的文件夹中或包含在模板中，然后包含它们像这样：

$temp_path = 'http//www.yourdomain.com/wp-content/theme/yourtheme/includes/';


include $temp_path.'file1.php';
include $temp_path.'file2.php';

我正在使用 temp_path 变量，因为出于某种原因bloginfo()，它get_bloginfo()似乎在函数文件中不起作用。

顺便说一句，即使它只是供个人使用，请尝试使用更独特的函数名称，quote可以是任何东西，tinymce_quote_button这绝对是它的本质。这可以避免以后潜在的函数名称冲突。