it-swarm.com.de

Wie füge ich TinyMCE mehrere Schaltflächen hinzu?

Ich habe ein Tutorial zu Nettuts zum Hinzufügen einer benutzerdefinierten Schaltfläche zu TinyMCE gelesen ( http://net.tutsplus.com/tutorials/wordpress/wordpress-shortcodes-the-right-way/ ).

Es funktioniert prima und alles, aber ich möchte viele Schaltflächen hinzufügen und frage mich, ob es eine clevere Möglichkeit gibt, dies zu tun, ohne den gesamten Code immer wieder kopieren zu müssen.

Hier ist der Code, den ich zum Hinzufügen einer Schaltfläche verwende:

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;  
}

Und dann erstelle ich eine customcodes.js-Datei mit diesem Code in:

(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);  
})();

Wie kann ich also mehrere Schaltflächen hinzufügen, ohne den gesamten Code für jede neue Schaltfläche ausführen zu müssen?

Danke :) Sebastian

7
sebfck

Fügen Sie zuerst Ihre zusätzlichen Schaltflächen in den Schaltflächen-Rückruf ein.

function register_button($buttons) {  
   array_Push($buttons, "quote","wpse-rules");  
   return $buttons;  
}

Dann fügen Sie zusätzliche Schaltflächen hinzu, die im Javascript des Plugins funktionieren.

    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]');  
            }  
        });
        ed.addButton('wpse-rules', {  
            title : 'WPSE Rules',  
            image : url+'/image.png',  
            onclick : function() {  
                 alert( 'WPSE Rules!' ); 
            }  
        });  
    },

Und so weiter, für zusätzliche Schaltflächen, die Sie möchten ..

5
t31os

Schauen Sie sich den QuickTag von WordPress an, wenn Sie Schaltflächen im Texteditorbereich hinzufügen möchten (funktioniert jedoch nicht im visuellen Editorbereich).

0
Soykot

Lesen Sie sich die Dateien durch und/oder laden Sie sie in meinem Tutorial zu diesem herunter. Der Grund, warum ich dies vorschlage, ist, dass ich alles in eine Klasse eingeordnet habe, damit Sie den Code nicht für jede Schaltfläche immer wieder neu schreiben müssen!

Jetzt schreibt die Klasse den Code grundsätzlich jedes Mal für Sie, wenn Sie ihn auf der WordPress-Seite der Dinge instanziieren, aber Sie müssen immer noch die Javascript-Funktionen für jede Schaltfläche schreiben.

Das Erstellen einer Schaltfläche ist der gleiche Vorgang, egal wie viele Sie benötigen. Die Funktion jeder Taste wird einzigartig sein, weshalb Sie für jede Taste einen eindeutigen Javascript-Aufruf benötigen.

0
Neil Davidson