我在Jacob Peattie和https://make.wordpress.org/core/2017/05/23/addition-of-tinymce-to-the-text-widget/

下面是我所做工作的快速演练：

我用我原来按钮的代码创建了一个新的js文件容器，但将其修改为小部件tinymce的事件侦听器

jQuery( document ).on( \'tinymce-editor-setup\', function( event, editor ) {
editor.settings.toolbar1 += \',bbh_custom_mce_button\';
var pathname = window.location.hostname;
var protocol = window.location.protocol
editor.addButton( \'bbh_custom_mce_button\', {
    title: \'Insert button\',
    image: protocol + \'//\' + pathname + \'/wp-content/themes/brandbyhand/include/tinymce-button/button-sharpen.png\',
    onclick: function() {
        editor.windowManager.open( {
            title: \'Insert button\',
            body: [
                {
                    type: \'textbox\',
                    name: \'text\',
                    label: \'Button text\'
                },
                {
                    type: \'textbox\',
                    name: \'link\',
                    label: \'Button link\',
                    class: \'custom-link\',

                    onkeydown: function( event ){
                        var link = jQuery(event.target).val();
                        var windowID = event.currentTarget.id;
                        jQuery(event.target).addClass(\'custom-link-\' + windowID);



                        /*if(link.indexOf(\'mailto:\') === -1 && link.indexOf(\'tel:\') === -1){
                            link = (link.indexOf(\'://\') === -1) ? \'http://\' + link : link;    
                        }

                        jQuery(event.target).val(link);*/
                    },
                    onfocusout: function( event ){
                        var link = jQuery(event.target).val();

                        var windowID = event.currentTarget.id;
                        jQuery(event.target).addClass(\'custom-link-\' + windowID);

                        if(link.indexOf(\'mailto:\') === -1 && link.indexOf(\'tel:\') === -1){
                            link = (link.indexOf(\'://\') === -1) ? \'http://\' + link : link;    
                        }

                        jQuery(event.target).val(link);
                    }
                },
                {
                    type   : \'listbox\',
                    name   : \'style\',
                    label  : \'Button style\',
                    values : [
                        { text: \'Empty\', value: \'ghost\' },
                        { text: \'Filled\', value: \'filled\' },
                    ],
                    value : \'style1\' // Sets the default
                },
                {
                    type   : \'checkbox\',
                    name   : \'target\',
                    label  : \'Open link in a new tab\',
                    checked : false

                }
            ],
            onsubmit: function( e ) {
                e.stopPropagation();

                var windowID = e.target._eventsRoot._id;


                var link = jQuery(\'.custom-link-\' + windowID).val();

                if(link.indexOf(\'mailto:\') === -1 && link.indexOf(\'tel:\') === -1){
                    link = (link.indexOf(\'://\') === -1) ? \'http://\' + link : link;
                }

                jQuery(\'.custom-link-\' + windowID).val(link);


                var target = \'_self\';
                if(e.data.target === true){
                    target = \'_blank\';
                } else if(e.data.target === false){
                    target = \'_self\'
                }

                editor.insertContent( \'<span class="clearfix"><a class="btn btn-custom \' + e.data.style + \'" target="\' + target + \'" href="\' + link + \'">\' + e.data.text + \'</a></span>\' );
                editor.windowManager.close();
            }
        });
    }
});
});

function my_enqueue($hook) {
if ( \'widgets.php\' != $hook ) {
    return;
}

    wp_enqueue_script( \'tinymce_custom_button_widget\', get_stylesheet_directory_uri() . \'/js/tinymce_widget.js\', array( \'jquery\' ), \'1.0\', true  );
    wp_enqueue_style( \'tinymce_custom_button_widget_css\', get_stylesheet_directory_uri() . \'/include/tinymce-button/custom-editor-style.css\', \'1.0\', \'all\');
}
add_action( \'admin_enqueue_scripts\', \'my_enqueue\' );