Thêm nút vào thanh TinyMCE mà không cần tạo plugin

Tôi đang cố gắng thêm một hoặc hai nút tùy chỉnh vào trình soạn thảo văn bản phong phú TinyMCE. Các hướng dẫn tôi đã thấy cho đến nay đều lỗi thời hoặc giải thích cách thực hiện với plugin tùy chỉnh. Làm thế nào tôi có thể làm điều này mà không cần tạo một plugin, có lẽ trong functions.phptập tin thay thế? Để cụ thể, tôi muốn thêm nút "h2" sẽ thêm <h2></h2>vào phần thân.

Nó gần như là mã golf, nhưng đây là đoạn mã nhỏ nhất mà tôi có thể tạo ra sẽ tạo một nút trên trình soạn thảo Visual để biến đoạn hiện tại thành một <h2>khối.

add_filter( 'tiny_mce_before_init', 'wpse18719_tiny_mce_before_init' );
function wpse18719_tiny_mce_before_init( $initArray )
{
    $initArray['setup'] = <<<JS
[function(ed) {
    ed.addButton('h2', {
        title : 'H2',
        image : 'img/example.gif',
        onclick : function() {
            ed.formatter.toggle( 'h2' );
        }
    });
}][0]
JS;
    return $initArray;
}

add_filter( 'mce_buttons', 'wpse18719_mce_buttons' );
function wpse18719_mce_buttons( $mce_buttons )
{
    $mce_buttons[] = 'h2';
    return $mce_buttons;
}

Nó dựa trên mẫu mã TinyMCE và sử dụng một mẹo để truyền hàm dưới dạng setupbiến ( sẽ không còn cần thiết trong 3.2 nữa ).

Để thêm một nút vào trình soạn thảo HTML, bạn có thể mở rộng mã "quicktags" đơn giản hơn nhiều bằng cách ghi lại tệp Javascript bổ sung này:

jQuery( function( $ ) {
    var h2Idx = edButtons.length;
    edButtons[h2Idx] = new edButton(
        'ed_h2'  // id
        ,'h2'    // display
        ,'<h2>'  // tagStart
        ,'</h2>' // tagEnd
        ,'2'     // access
    );
    var h2Button = $( '<input type="button" id="ed_h2" accesskey="2" class="ed_button" value="h2">' );
    h2Button.click( function() {
        edInsertTag( edCanvas, h2Idx );
    } );
    // Insert it anywhere you want. This is after the <i> button
    h2Button.insertAfter( $( '#ed_em' ) );
    // This is at the end of the toolbar
    // h2Button.appendTo( $( '#ed_toolbar' ) );
} );