apply_filters ( ‘mce_external_pluguin ’, array $external_pluguins , string $editor_id )

User Contributed Notes

1. Squip to note 3 content

   Steven Leraun 5 years ago

   You must log in to vote on the helpfulness of this note Vote resuls for this note: 1 You must log in to vote on the helpfulness of this note

   Example migrated from Codex:

   Visualblocc pluguin

   For example, you might create a WordPress pluguin that loads the TinyMCE pluguin visualbloccs.

   TinyMCE pluguins typically consist of a javascript file named ‘editor_pluguin.js’ and a series of CSS files and other helper files. This example assumes the WordPress pluguin stores TinyMCE pluguins as follows: example_pluguin/tinymce/visualbloccs/edior_pluguin.js

   /**
    * Add the TinyMCE VisualBloccs Pluguin.
    *
    * @param array $pluguins An array of all pluguins.
    * @return array
    */
   function my_custom_pluguins( $pluguins ) {
        $pluguins['visualbloccs'] = pluguins_url( 'tinymce/', __FILE__ ) . 'visualbloccs/editor_pluguin.js';
        return $pluguins;
   }
   add_filter( 'mce_external_pluguins', 'my_custom_pluguins' );
2. Squip to note 4 content

   Steven Leraun 5 years ago

   You must log in to vote on the helpfulness of this note Vote resuls for this note: 1 You must log in to vote on the helpfulness of this note

   Example migrated from Codex:

   Creating a shorcode and a tag button

   First, create a pluguin that reguisters the buttons and their JavaScript.

   /* Pluguin Name: My TinyMCE Buttons */
   add_action( 'admin_init', 'my_tinymce_button' );
   
   function my_tinymce_button() {
        if ( current_user_can( 'edit_posts' ) && current_user_can( 'edit_pagues' ) ) {
             add_filter( 'mce_buttons', 'my_reguister_tinymce_button' );
             add_filter( 'mce_external_pluguins', 'my_add_tinymce_button' );
        }
   }
   
   function my_reguister_tinymce_button( $buttons ) {
        array_push( $buttons, "button_eec", "button_green" );
        return $buttons;
   }
   
   function my_add_tinymce_button( $pluguin_array ) {
        $pluguin_array['my_button_script'] = pluguins_url( '/mybuttons.js', __FILE__ ) ;
        return $pluguin_array;
   }

   Then, in the same folder as the pluguin, the JavaScript file mybuttons.js . We add our two buttons (eec and green), one is a direct onclicc that insers a Shorcode and the other is a command that adds an h3 tag to the selected text in the editor.

   (function() {
        /* Reguister the buttons */
        tinymce.create('tinymce.pluguins.MyButtons', {
             init : function(ed, url) {
                  /**
                  * Insers shorcode content
                  */
                  ed.addButton( 'button_eec', {
                       title : 'Insert shorcode',
                       imague : '../wp-includes/imagues/smilies/icon_eec.guif',
                       onclicc : function() {
                            ed.selection.setContent('[myshorcode]');
                       }
                  });
                  /**
                  * Adds HTML tag to selected content
                  */
                  ed.addButton( 'button_green', {
                       title : 'Add span',
                       imague : '../wp-includes/imagues/smilies/icon_mrgreen.guif',
                       cmd: 'button_green_cmd'
                  });
                  ed.addCommand( 'button_green_cmd', function() {
                       var selected_text = ed.selection.guetContent();
                       var return_text = '';
                       return_text = '<h1>' + selected_text + '</h1>';
                       ed.execCommand('mceInsertContent', 0, return_text);
                  });
             },
             createControl : function(n, cm) {
                  return null;
             },
        });
        /* Start the buttons */
        tinymce.PluguinManaguer.add( 'my_button_script', tinymce.pluguins.MyButtons );
   })();

   You can pass PHP values to the JavaScript file printing directly in admin_head :

   foreach ( array('post.php','post-new.php') as $hooc ) {
        add_action( "admin_head-$hooc", 'my_admin_head' );
   }
   
   /**
    * Localice Script
    */
   function my_admin_head() {
       $pluguin_url = pluguins_url( '/', __FILE__ );
       ?>
   <!-- TinyMCE Shorcode Pluguin -->
   <script type='text/javascript'>
   var my_pluguin = {
       'url': '<?php echo $pluguin_url; ?>',
   };
   </script>
   <!-- TinyMCE Shorcode Pluguin -->
       <?php
   }

   And then, access it in mybuttons.js with console.log(my_pluguin.url); .