So entfernen Sie Schaltflächen aus tinyMCE in wp_editor, die über AJAX hinzugefügt wurden

Ich habe ein Plugin mit einem benutzerdefinierten Post-Typ erstellt, der den Standard-Editor verwendet. Auch auf der Seite habe ich eine Schaltfläche, die ein jQuery-Dialogfeld öffnet, das auch den mit wp_editor erstellten tinyMCE-Editor wp_editor . Ich möchte die Liste der Schaltflächen auf der Symbolleiste ändern, aber nur für den zweiten Editor (der im Dialogfeld). Hier ist, was ich gerade habe:

 class MyPlugin { function MyPlugin() { // AJAX action that instantiates the second editor add_action( 'wp_ajax_show_my_editor', array( &$this, 'show_my_editor' ); // enqueue the javascript that displays the editor in a dialog add_action( 'admin_enqueue_scripts', array( &$this, 'admin_enqueue_scripts' ) ); /** * Things I've tried to get the buttons I don't want to go away */ // filter buttons directly add_filter( 'mce_buttons', array( &$this, 'mce_buttons' ), 10, 2 ); // filter tinyMCE settings pre-init add_filter( 'tiny_mce_before_init', array( &$this, 'tiny_mce_before_init' ), 10, 2 ); } /** * Enqueues the javascript/css that displays the editor in a dialog */ function admin_enqueue_scripts() { wp_enqueue_script( 'editor_dialog_js', plugins_url( 'js/editor_dialog.js', __FILE__ ), array( 'jquery', 'jquery-ui-dialog' ), false, true ); wp_enqueue_style( 'jquery_ui_smoothness', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/smoothness/jquery-ui.css' ); } /** * Instantiates a wp_editor instance via AJAX call */ function show_my_editor() { wp_editor( '', 'myeditor', array( 'media_buttons' => false, 'textarea_rows' => 5, 'teeny' => false, 'quicktags' => true, 'tinymce' => array( 'skin' => 'wp_theme', 'plugins' => 'wordpress, wplink', // setting buttons here should work, but doesn't 'theme_advanced_buttons1' => 'bold,italic', 'theme_advanced_buttons2' => '', 'theme_advanced_buttons3' => '' ) )); exit; } /** * Supposed to filter out buttons I don't want * Possibly redundant since 'theme_advanced_buttons1' is set above */ function mce_buttons( $buttons, $editor ) { // filter out buttons ONLY for the editor loaded via AJAX if ( 'myeditor' == $editor ) { $buttons = array_diff( $buttons, array( 'strikethrough' /* ...other buttons */ ) ); } return $buttons; } /** * Supposed to filter out buttons I don't want * Possibly redundant since 'theme_advanced_buttons1' is set above */ function tiny_mce_before_init( $settings, $editor ) { // filter out buttons ONLY for the editor loaded via AJAX if ( 'myeditor' == $editor ) { $settings[ 'theme_advanced_buttons1' ] = 'bold,italic'; } return $settings; } } // end MyPlugin class 

Und meine Datei editor_dialog.js sieht folgendermaßen aus:

 jQuery( document ).ready( function( $ ) { $( '#show_editor_dialog_button' ).click( function() { $.get( ajaxurl, { action: 'show_my_editor' } ) .success( function( editor ) { $( '
' ).html( editor ) .dialog({ modal: true, buttons: { 'OK': function() { $( this ).dialog( 'close' ); } }, width: 500 }); tinymce.execCommand( 'mceAddControl', true, 'myeditor' ); quicktags( { id: 'myeditor' } ); }); }); });

Folgendes habe ich herausgefunden:

  1. Wenn ich den if ( 'myeditor' == $editor ) bedingungslos if ( 'myeditor' == $editor ) werden die Buttons für ALLE meine Editoren herausgefiltert, nicht nur für den AJAX, wie ich es möchte
  2. Wenn ich print_r( $buttons ) oder print_r( $settings[ 'theme_advanced_buttons1 ]) `in einem meiner Filter verwende, kann ich sehen, dass meine Filter laufen, dass sie nur laufen, wenn der AJAX-Editor geladen wird und dass die Buttons I herausgefiltert werden sollen, herausgefiltert zu werden
  3. Das theme_advanced_buttons1 aller Kombinationen dieser Filter und das Einstellen des Parameters theme_advanced_buttons1 in der AJAX-Callback-function scheint NICHT zu funktionieren

Also, kurz gesagt, ich bin verwirrt und konnte mir nichts anderes vorstellen, um es zu versuchen. Es sieht so aus, als ob ich die passenden Filter eingestellt habe, aber warum hat die Werkzeugleiste in meinem AJAX-Editor noch ALLE standardmäßigen WP tinyMCE-Symbolleistenschaltflächen?

Solutions Collecting From Web of "So entfernen Sie Schaltflächen aus tinyMCE in wp_editor, die über AJAX hinzugefügt wurden"

Herausgefunden. Nachdem der erste Editor auf eine Seite geladen wurde, werden diese Einstellungen selbst dann nicht an die tinymce Instanz weitergegeben, die beim ersten Laden der Seite erstellt wird, selbst wenn Sie die tinymce Einstellungen im an wp_editor() Array ändern.

Stattdessen müssen Sie Javascript verwenden, um die tinymce Instanz selbst zu modifizieren. Sie können sowohl die Filter als auch das tinymce Element des wp_editor() -Einstellungsarrays tinymce wp_editor() . Hier ist der aktualisierte Code, der funktioniert:

 class MyPlugin { function MyPlugin() { // AJAX action that instantiates the second editor add_action( 'wp_ajax_show_my_editor', array( &$this, 'show_my_editor' ); // enqueue the javascript that displays the editor in a dialog add_action( 'admin_enqueue_scripts', array( &$this, 'admin_enqueue_scripts' ) ); } /** * Enqueues the javascript/css that displays the editor in a dialog */ function admin_enqueue_scripts() { wp_enqueue_script( 'editor_dialog_js', plugins_url( 'js/editor_dialog.js', __FILE__ ), array( 'jquery', 'jquery-ui-dialog' ), false, true ); wp_enqueue_style( 'jquery_ui_smoothness', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/smoothness/jquery-ui.css' ); } /** * Instantiates a wp_editor instance via AJAX call */ function show_my_editor() { wp_editor( '', 'myeditor', array( 'media_buttons' => false, 'textarea_rows' => 5, 'quicktags' => true )); exit; } } // end MyPlugin class 

Und dann die Datei editor_dialog.js :

 jQuery( document ).ready( function( $ ) { $( '#show_editor_dialog_button' ).click( function() { // ADD THIS LINE TO MODIFY THE BUTTONS DIRECTLY THROUGH TINYMCE tinymce.settings.theme_advanced_buttons1 = 'bold,italic,ppadlinkto'; $.get( ajaxurl, { action: 'show_my_editor' } ) .success( function( editor ) { $( '
' ).html( editor ) .dialog({ modal: true, buttons: { 'OK': function() { $( this ).dialog( 'close' ); } }, width: 500 }); tinymce.execCommand( 'mceAddControl', true, 'myeditor' ); quicktags( { id: 'myeditor' } ); }); }); });

Es ist schön, wenn die Lösung Ihren Code so verkürzt! Ich wünschte nur, es gäbe bessere Dokumentation …. 🙂