6

TinyMCE にカスタム ボタンを追加する方法に関する Nettuts のチュートリアルに従いました ( 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);  
})();

繰り返しになりますが、新しいボタンごとにこのコードをすべて実行することなく、複数のボタンを追加するにはどうすればよいでしょうか?

ありがとう:) セバスチャン

4

4 に答える 4

8

私があなたの質問を正しく理解していれば、関数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().

一方、追加するボタンが 1 つしかない場合は、次のようになります。

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のドキュメントがあります

于 2012-05-10T03:44:27.347 に答える
2

ステップ 3 で php を変更して、2 番目のボタンを押します。

//Step 3: Register Our Button
function register_button($buttons) {  
   array_push($buttons, "BOUTON1");  
   array_push($buttons, "BOUTON2");  
   return $buttons;  
}

その BOUTON2 に特定のパスを追加します。

//Step 4: Register Our TinyMCE Plugin
    function add_plugin($plugin_array) {  
       $plugin_array['BOUTON1'] = '/yourpathtojs/bouton1.js';  
       $plugin_array['BOUTON2'] = '/yourpathtojs/bouton2.js';  
       return $plugin_array;  
    }

次に、それぞれに個別のファイルがあり、PLUG1 と BOUTON1 の使用を見てください。「引用」という用語で区別されていないため、nettuts の方が優れています。

bouton1.js :

(function() {  
    tinymce.create('tinymce.plugins.PLUG1', {  
        init : function(ed, url) {  
            ed.addButton('BOUTON1', {  
                title : 'You', image : url+'/image.png',  
                onclick : function() { ed.selection.setContent('[thumb from="youtube" code="'+ed.selection.getContent()+'"]'); }  
            });  
        },  
        createControl : function(n, cm) {  
            return null;  
        },  
    });  
    tinymce.PluginManager.add('BOUTON1', tinymce.plugins.PLUG1);  
})();

bouton2.js :

(function() {  
        tinymce.create('tinymce.plugins.PLUG2', {  
            init : function(ed, url) {  
                ed.addButton('BOUTON2', {  
                    title : 'Vim', image : url+'/image.png',  
                    onclick : function() { ed.selection.setContent('[thumb from="vimeo" code="'+ed.selection.getContent()+'"]'); }  
                });  
            },  
            createControl : function(n, cm) {  
                return null;  
            },  
        });  
        tinymce.PluginManager.add('BOUTON2', tinymce.plugins.PLUG2);  
    })();
于 2012-04-07T11:04:47.133 に答える
1

既存の関数内に余分なボタンコードを追加することを除けば、あなたがしようとしていることを行う方法はないと思います。

残念ながら、これはボタンを追加するためのコードなので、別のボタンを追加する場合は、コードを再度追加する必要があります。

追加したいボタンがほとんどすべての点で類似している場合、データをフィードforeach {}するswitch(){case '':}場所で a を実行することで済むかもしれませんが、すべてのボタンが同じことをしない限り、これは少し冗長に思えます。

あなたがやろうとしているのがあなたのfunction.phpファイルをきれいに保つことだけなら、私は各ボタンをメイン関数と同じ名前の別々の.phpファイルに入れ、あなたのテンプレート内のincまたはincludesというフォルダに入れ、それらを含めることをお勧めしますそのようです：

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


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

bloginfo()なんらかの理由でget_bloginfo()関数ファイルで機能しないように見えるため、temp_path 変数を使用しています。

余談ですが、個人的な使用のためだけに、よりユニークな関数名を使用するようにしてください。quote何でもかまいませんtinymce_quote_button。それは間違いなくそれです。これにより、後で関数名が競合する可能性が回避されます。

于 2011-04-04T01:25:47.277 に答える
0

すべてのボタンが関連していて、一度にすべてを追加したい場合（つまり、追加するボタンを選択して選択する必要がない場合は、init呼び出しでed.addButton呼び出しを複製するだけで済みます。各addbutton呼び出しを独自の関数にカプセル化します。

(function() {  
    function addQuoteButton(ed, url){
        ed.addButton('quote', {  
            title : 'Add a Quote',  
            image : url+'/image.png',  
            onclick : function() {  
                 ed.selection.setContent('[quote]' + ed.selection.getContent() + '[/quote]');  
            }  
        });  
    }
    function addOtherButton(ed, url){
        // functionality to add another button.
    }
    tinymce.create('tinymce.plugins.quote', {  
        init : function(ed, url) {
            addQuoteButton(ed, url);
            addOtherButton(ed,url);  
        },  
        createControl : function(n, cm) {  
            return null;  
        },  
    });  
    tinymce.PluginManager.add('quote', tinymce.plugins.quote);  
})();

さらに分解するために、add * Button関数を独自のファイルに分割することができます（@DouglasMarkenによって提案されています）。

于 2011-04-04T21:51:20.117 に答える