web-dev-qa-db-ja.com

TinyMCE 4キーボードショートカットを無効にする方法

all TinyMCE 4のキーボードショートカットを無効にします。私は実行可能な解決策を探しましたが、TinyMCEドキュメンテーションがどれほど貧弱であるかに気づいただけです。

私は1つの 答えを見つけました しかし、私はそれを適用する方法がわからないか、それがTinyMCE 4（それはWP 3.9+で導入された）で働かないかのどちらかです。

これをクラックできる合理的なTinyMCEとWPの知識をお持ちの方は誰ですか？

tinymcevisual-editor
3
TBone

Re answer OPで引用されている：

メタやアクセスなどを追加するために編集されました。

言及されているcustom_shortcutsフラグはtinymce 3.xにありました（ here を見てください）が、4.xから削除されました。

上記のfoo関数メソッドはまだ使用できます。あなたのテーマの "functions.php"で：

add_action( 'wp_tiny_mce_init', function () {
    ?>
    <script>
        function wpse167402_tiny_mce_init(ed) {
            ed.on('init', function () {
                // Note these lists may not be complete & that other tinymce plugins can add their own shortcuts anyway.
                var ctrls = [ 'b', 'i', 'u', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'z', 'y,ctrl+shift+z', 's', 'k', 'Alt+F', 'P', 'shift+e > ctrl+shift+p' ]; // Could add 'x', 'c', 'v'.
                var metas = [ 'b', 'i', 'u', 'z', 'y,meta+shift+z', 's', 'k' ]; // Could add 'x', 'c', 'v'.
                var modKeys = [ 'c', 'r', 'l', 'j', 'q', 'u', 'o', 'n', 's', 'm', 'z', 't', 'd', 'h', 'o', 'x', 'a', 'w' ];
                var accesss = [ '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 's', 'c', 'r', 'l', 'j', 'q', 'u', 'o', 'm', 'z', 't', 'd', 'h', 'p', 'x' ];
                var others = [ 'Ctrl+Shift+F', 'Meta+K', 'alt+119', 'Alt+F10', 'Alt+F9', 'Alt+F10,F10', 'Alt+F11' ];
                var i;

                // Overwrite shortcuts with no-op function. Key sequences will still be captured.
                for (i = 0; i < ctrls.length; i++ ) {
                    this.addShortcut('ctrl+' + ctrls[i], '', function () {});
                }
                for (i = 0; i < metas.length; i++ ) {
                    this.addShortcut('meta+' + metas[i], '', function () {});
                }
                for (i = 0; i < modKeys.length; i++ ) {
                    this.addShortcut('alt+shift+' + modKeys[i], '', function () {});
                }
                for (i = 0; i < accesss.length; i++ ) {
                    this.addShortcut('access+' + accesss[i], '', function () {});
                }
                for (i = 0; i < others.length; i++ ) {
                    this.addShortcut( others[i], '', function () {});
                }
            });
        }
    </script>
    <?php
});
function wpse167402_tiny_mce_before_init( $mceInit ) {
    $mceInit['setup'] = 'wpse167402_tiny_mce_init';
    return $mceInit;
}
add_filter( 'tiny_mce_before_init', 'wpse167402_tiny_mce_before_init' );

元の答え

元の答えはエディタのshortcutsオブジェクトを何もしない操作に置き換えたものです（SettupEditorイベントはTinymceインスタンスが作成される前に発生します）。

add_action( 'wp_tiny_mce_init', function () {
    ?>
    <script>
    tinymce.on('SetupEditor', function (editor) {
        editor.shortcuts = { add: function() {} };
    });
    </script>
    <?php
});

これはすべてのtinymceのショートカットを無効にしますが、デフォルトのブラウザの動作を許可するという残念な副作用があります。これはcontentEditable要素（これはtinymceの編集ボックスとしてマークされています） + u（これに関するドキュメントは非常に貧弱です）、ブラウザによって異なります。この答えを基本的に最初のものと同じにするこれを回避する方法は、noop関数で置き換えられたcmdFuncで、元の関数へのショートカットをそのまま渡すことです。

add_action( 'wp_tiny_mce_init', function () {
    ?>
    <script>
    tinymce.on('SetupEditor', function (editor) {
        var orig_shortcuts_add = editor.shortcuts.add;
        editor.shortcuts.add = function(pattern, desc, cmdFunc, scope) {
            return orig_shortcuts_add(pattern, desc, function () {}, scope);
        };
    });
    </script>
    <?php
});
3
bonger

IdはID共有を考えていました：私はwp_editor（）を通してフロントエンドでtinymceを使っています。

<?php
                            $content = $posted['rm_details'];
                            $editor_id = 'rm_details';
                            $settings = array(
                                'media_buttons'     => false,
                                'drag_drop_upload'  => false,
                                'textarea_rows'     => '15',
                                'tinymce' => array(
                                    'content_css'               => get_template_directory_uri() . '/styles/tinymce5.css',
                                    'toolbar1'                  => 'bold,bullist,numlist',
                                    'toolbar2'                  => '',
                                    'paste_Word_valid_elements' => 'p,b,strong,li,br',
                                    'plugins'                   => '',
                                ),
                                'quicktags'         => false
                            );
                            wp_editor( esc_textarea( $content ), $editor_id, $settings ); ?>

'plugins' => ''を設定すると、うまくいくようです。

また、これは私にとってデフォルトのブラウザショートカットを有効にするようです。

ありがとう

ネイサン

0
Nathan