web-dev-qa-db-ja.com

ページまたはは投稿を更新するためのキーボードショットカット

キーボードショートカット を更新するための - ページや投稿とは何ですか?下書きを転がすのには時間がかかるので、時間を節約できます。

8
Paul Felt

私はこれに興味があり、 キーボードショートカットのコーデックス をチェックしましたが、それがそこに言及されているのを見つけませんでした。

私は検索したところ、これはすでに解決されているようです。 herehere

私はこれらの他のプラグインをテストしていないので、それらがどのようにそれを解決するのかわからないが、私は挑戦して、これがどのように解決されるかを見ることにした;-)

だからここに私のためのショートカットを作成するための私のハックです:

ctrl+s : Save Draft
ctrl+p : Publish / Update

次のテストプラグインafter_wp_tiny_mce フック内で実行されます。

/**
 * Plugin Name: Testing ctrl+s and ctrl+p for saving and publishing posts.
 * Plugin URI:  https://wordpress.stackexchange.com/a/199411/26350
 */
add_action( 'after_wp_tiny_mce', function()
{?><script>
    ( function ( $ ) {
        'use strict';
        $( window ).load( function () {
            wpse.init();
        });
        var wpse = {
            keydown : function (e) {
                if( e.ctrlKey && 83 === e.which ) {
                    // ctrl+s for "Save Draft"
                    e.preventDefault();
                    $( '#save-post' ).trigger( 'click' ); 
                } else if ( e.ctrlKey && 80 === e.which ) {
                    // ctrl+p for "Publish" or "Update"
                    e.preventDefault();
                    $( '#publish' ).trigger( 'click' );
                }
            },
            set_keydown_for_document : function() {
                $(document).on( 'keydown', wpse.keydown );
            },
            set_keydown_for_tinymce : function() {
               if( typeof tinymce == 'undefined' )
                   return;
               for (var i = 0; i < tinymce.editors.length; i++)
                   tinymce.editors[i].on( 'keydown', wpse.keydown );
           },
           init : function() {
               wpse.set_keydown_for_document();
               wpse.set_keydown_for_tinymce();
           }
       }                                                        
    } ( jQuery ) );
    </script><?php });

ページ上のすべてのtinymceエディタにwpse.keydownevent-callback)を追加したので、そこからショートカットも利用できます。

私たちはtinymcejavascriptオブジェクトを扱っているので、 Vanilla installの便利なテストフックとしてafter_wp_tiny_mceフックを使っていることに注意してください。通常どおり、.jsファイルから作成します。

また、@(_bongerによる here のように、tinymceSetupEditorイベントを使用することもできます。ただし、ここでは、tinymceが定義されているかどうか定義されていないページ

// Keydown for tinymce
if( typeof tinymce != 'undefined' )
{
    tinymce.on( 'SetupEditor', function (editor) {
        wpse.set_keydown_for_tinymce();
    });
}
// Keydown for document
wpse.set_keydown_for_document();

おそらくネイティブtinymceshortcuts)もセットアップできます。

これにはテストと調整が必要かもしれませんが、私のインストールではうまくいくようです。

8
birgire