How to add shortcodes in editors’ text tab?

1 comment

1. Interesting question, couldn’t find any reference here or at WordPress Developers and found the solution on a Japanese page.

   In the code, we’re triggering the filter hooks only on the pages /wp-admin/post-new.php and /wp-admin/post.php and only for the page post type.

   <?php
   /**
    * Plugin Name: (SO) Add buttons to Text mode editor
    * Plugin URI:  http://stackoverflow.com/a/22425171/1287812
    * Description: Based on http://fog-town.net/note/web/addquicktag-unplugged/
    * Author:      brasofilo
    * License:     GPLv3
    */
   
   // Hook only in this admin pages
   foreach( array( 'post', 'post-new' ) as $hook )
       add_action( "load-$hook.php", 'setup_so_22396339' );
   
   // Hook only for the 'page'  post type
   function setup_so_22396339()
   {
       global $typenow;
       if( 'page' !== $typenow )
           return;
       add_filter( 'quicktags_settings', 'quicktags_so_22396339', 10, 2 );
       add_action( 'admin_print_footer_scripts', 'my_quicktags_so_22396339' );
   }
   
   // Default buttons (remove buttons from the comma-separated string)
   function quicktags_so_22396339( $qtInit, $editor_id ) 
   {
       // There's another editor for the Comments box (editor_id == 'replycontent')
       if( 'content' === $editor_id )
           $qtInit['buttons'] = 'link,block,img,ul,ol,li,code,more,spell,close,fullscreen';
       return $qtInit;
   }
   
   // Add new buttons
   function my_quicktags_so_22396339() 
   { 
       // Don't know how to target only the main content editor. Changes are applied to both editors (content and comments).
       ?>
       <script type="text/javascript">
           //QTags.addButton('ID', 'label', 'start_tag', 'end_tag', 'access_key', 'title', 'priority', 'instance');
           QTags.addButton( 'shortcode_1', 'shortcode 1', '[shortcode1]', '[/shortcode1]', '', 'Tooltip about the shortcode 1', '1', '' );
           QTags.addButton( 'shortcode_2', 'shortcode 2', '[shortcode2 category="ADD-THE-CATEGORY-ID"]', '', '', 'Tooltip about the shortcode 2', '1', '' );
           QTags.addButton( 'pre_tag', 'my-pre', '<pre>', '</pre>', '', '<pre></pre>', '1', '' );
           QTags.addButton( 'div_tag', 'my-div', '<div>', '</div>', '', '<div></div>', '101', '' );
           QTags.addButton( 'span_tag', 'my-span', '<span>', '</span>', '', '<span></span>', '150', '' );
       </script>
       <?php
   }
   

   It’s not possible to put a custom button after the full screen, check the priorities in QTags.addButton:

   

   Log in to Reply