CODEWITHSUNDEEP
ckeditor
Samiul Amin Shanto
Samiul Amin Shanto

Reputation: 1397

CKEDITOR insert special symbol with Keyboard shortcut

I am working on a project which has a requirement is: if user press a shortcut then a symbol will insert in text editor. Like:

if press Shift+1 then insert ✓
if press Shift+2 then insert ✗

I have done this in textarea but I am using CKEDITOR in this project and I have tried by 'keystrokes' like this but didn't work:

CKEDITOR.config.keystrokes = [
        [ CKEDITOR.SHIFT + 76, function(){
            console.log('sdsd');
        } ]
];

Can somebody help me out please?

Upvotes: 1

Views: 620

Answers (2)

xiidea
xiidea

Reputation: 3394

You can use command to execute a function like follow. 

CKEDITOR.plugins.add('foo',
    {            
        init: function( editor ) {
            editor.addCommand( 'sample', {
                exec: function( editor ) {
                    alert( 'Executing a command for the editor name "' + editor.name + '"!' );
                }
            } );

            editor.setKeystroke( CKEDITOR.CTRL + 81, 'sample' ); // CTRL+Q
        }
    });

or in your way but after defining the command.

CKEDITOR.config.keystrokes = [
        [ CKEDITOR.SHIFT + 76, 'sample' ]
];

The second value for the CKEDITOR.config.keystrokes expects a command name not a function.

NB: As the implementation is using plugin. You also have to configure the editor to use the plugin using extraPlugins configuration

CKEDITOR.replace('editor', {
        extraPlugins : 'foo'
    });

As your need is simply to map a keystroke to a symbol. You can use this plugin.

disclaimer: I'm the author of that plugin

Upvotes: 1

Lalji Nakum
Lalji Nakum

Reputation: 380

You need to use setkystroke method like this :

For 4.x, use editor.setKeystroke:

            CKEDITOR.plugins.add( 'test', {
                init: function( editor ) {
                    editor.setKeystroke( CKEDITOR.CTRL + 81, 'bold' ); // CTRL+Q
                }
            } );

For 3.x:

            CKEDITOR.plugins.add( 'test', {
                init: function( editor ) {
                    editor.on( 'instanceReady', function( evt ) {
                        evt.removeListener();
                        this.keystrokeHandler.keystrokes[ CKEDITOR.CTRL + 81 ] = 'bold'; // CTRL+Q
                    } );
                }
            } );

Upvotes: 0

Related Questions