I have created a plugin which adds custom tags to the body of a page (in the following format):
<my:asset-type asset-id="1">Placeholder text</my:asset-type>
I can add a single tag without any issue. However, there are a few problems when adding more tags.
The tags are meant to be rendered on a separate line like other block elements (<p>, <h2>)
<my:asset-type asset-id="1">Placeholder text</my:asset-type>
<my:asset-type asset-id="2">Placeholder text</my:asset-type>
Instead they are rendering inline one after the other.
<my:asset-type asset-id="1">Placeholder text</my:asset-type><my:asset-type asset-id="2">Placeholder text</my:asset-type>
2. Entering a newline after the placeholder text adds a new paragraph (<p>) inside of the custom tag but it should be creating the new paragragh outside of the custom tag. In short, only one text node should be allowed inside the custom tag.
This is the code that I am using to add my custom tag to the DTD:
CKEDITOR.dtd['asset-type'] = {};
CKEDITOR.dtd.$block['asset-type'] = 1;
CKEDITOR.dtd.body['asset-type'] = 1;
This is how the custom tag is being added to the editor:
var customElement = editor.document.createElement('asset-type');
customElement.setAttribute('asset-id', 1);
customElement.setText('Placeholder text');
editor.insertElement(customElement);
Any suggestions are greatly appreciated.