Contribute to this guideReport an issue

Enter Key Configuration Documentation

This sample shows how to configure the Enter and Shift+Enter keys to perform actions specified in the config.enterMode and config.shiftEnterMode settings, respectively.

You can play with different settings for the Enter and Shift+Enter keys below and then add some text in the editor. See what effect these settings have by clicking the   Source toolbar button and examining the source code.

When Enter is pressed:
When Shift+Enter is pressed:


Changing the Enter Mode setting to BR or DIV is not recommended. The default CKEDITOR.ENTER_P mode is fully supported by all editor features and plugins and is also the most correct one in terms of best practices for creating web content.

If you want to change it to control paragraph spacing, you should use stylesheets instead. Edit the contents.css file and set up a suitable margin value for <p> elements, for example:

p { margin: 0; }

Get Sample Source Code

  • Enter key configuration
    <!doctype html>
    <html lang="en">
    
    <head>
      <meta charset="utf-8">
      <meta name="robots" content="noindex, nofollow">
      <title>Enter key configuration</title>
      <script src="https://cdn.ckeditor.com/4.24.0-lts/standard-all/ckeditor.js"></script>
    </head>
    
    <body>
      <textarea cols="80" id="editor1" name="editor1" rows="10">This is some sample text.
    </textarea>
    
      <script>
        CKEDITOR.replace('editor1', {
          // Pressing Enter will create a new <div> element.
          enterMode: CKEDITOR.ENTER_DIV,
          // Pressing Shift+Enter will create a new <p> element.
          shiftEnterMode: CKEDITOR.ENTER_P,
          removeButtons: 'PasteFromWord'
        });
      </script>
    
    </body>
    
    </html>