Home/ Questions/Q 8703121
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T02:48:26+00:00

When creating new paragraphs in CKEditor the attributes (styles, classes) of the previous paragraph

  • 0

When creating new paragraphs in CKEditor the attributes (styles, classes) of the previous paragraph get copied onto the new one. Is there a way to prevent this?

For example, if I’m writing in a centered paragraph and press enter to create a new paragraph, my users want the new paragraph to be a simple

without “inheriting” anything from the previous by default.

Edit

I managed to get it (dangeriously untested) working with Reinmar’s tips. Here is what I wound up with; I hope this helps someone else. If you guys see a glaring error here, please do tell me

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.on('key', function(evt) {
        if (evt.data.keyCode === 13) {
            // if we call getStartElement too soon, we get the wrong element
            setTimeout(function () {
                var se = e.editor.getSelection().getStartElement();
                if(se.getName() == "span") {
                    var text = se.getText(); // Store text, we are about to nuke the spans
                    while (se.getName() == "span") { // possible infinite loop danger
                        se = se.getParent();
                    }
                    if (text.length == 0)
                        se.setHtml(" "); // It's important that this is not empty
                    else
                        se.setHtml(text);
                }
                debug(se.getHtml());
                se.removeAttribute("class");
                se.removeAttribute("mycustomattr");
                se.removeAttribute("myothercustomattr");
                window.bla = se; // useful for debugging
            }, 10);
        }
    });
});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I was thinking about your question for last two days and I’ve got an idea. I checked enter plugin code and it’d better to leave it untouched. Instead you can listen on enter key and after our custom enter is performed you should clear styles from newly created block.

    These methods will be useful:

    • editor.on( 'key', function( evt ) { evt.data.key... } )
    • editor.getSelection().getStartElement() – after enter selection start will be placed in newly created block (+ inline elements like bold, underline, etc).
    • CKEDITOR.dtd.* – sets of elements may help you making decision which elements are inline styles and should be removed.
    • element.isEmptyInlineRemoveable – you should remove empty inline elements in which cursor was placed.
    • editor.createRange().setStartAt( block, 0 ).select() – at the end you should place caret in correct place (at the beginning of block – <p>/<div>/<li>/etc.).

    Unfortunately, as you can see, this’s not an easy thing to write, so good luck 🙂

    • 0