web-dev-qa-db-fra.com

Comment désactiver les raccourcis clavier TinyMCE 4

Je veux désactiver all TinyMCE 4 raccourcis clavier. J’ai cherché une solution pratique, mais j’ai seulement réalisé à quel point la documentation de TinyMCE est médiocre.

J'ai trouvé un répondre ici mais je ne sais pas comment l'appliquer ou cela ne fonctionne pas avec TinyMCE 4 (introduit avec WP 3.9+).

Toute personne disposant de connaissances raisonnables en TinyMCE et WP peut-elle résoudre ce problème?

3
TBone

Re réponse cité par le PO:

Édité pour ajouter des méta, accès et autres.

Les drapeaux custom_shortcuts mentionnés étaient en tinymce 3.x (voir ici ) mais ont été supprimés de la version 4.x et lors de la numérisation de la source, rien d’équivalent ne semble avoir été substitué.

La méthode de la fonction foo mentionnée peut toujours être utilisée. Dans votre thème "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' );

Réponse originale

La réponse d'origine a remplacé l'objet shortcuts de l'éditeur par un no-op (l'événement SettupEditor est déclenché avant la création de toutes les instances tinymce):

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

Bien que cela désactive tous les raccourcis de tinymce, il a malheureusement pour effet secondaire de permettre le comportement par défaut du navigateur, qui peut contenir, pour les éléments contentEditable (que la zone d'édition de tinymce est marquée), divers formats tels que ctrl + b, ctrl + i et ctrl. + u (la documentation à ce sujet est très médiocre), selon le navigateur. Une façon de contourner ce problème, qui fait en sorte que cette réponse soit fondamentalement la même que la première, consiste simplement à transmettre les raccourcis à la fonction d'origine en remplaçant la variable cmdFunc par une fonction noop:

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 juste pensé partager id: J'utilise tinymce dans le frontend via wp_editor () J'ai désélectionné les raccourcis clavier comme insérer/éditer un lien, etc. ou de l'aide et j'utilise:

<?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 ); ?>

Paramétrer 'plugins' => '', semble faire l'affaire.

En outre, cela semble activer les raccourcis du navigateur par défaut pour moi,

Merci

Nathan

0
Nathan