Replace text format setup with custom CKEditor plugin

The change will require a documentation change:

Allowing required HTML in CKEditor
For proper functionality, some HTML tags an attributes need to be enabled.

By default configuration, specific tags and attributes are stripped from HTML input and output as to the text format's CKEditor configuration. Yet, for proper functionality, some tags (<img>, <a>, <span>) and attributes on those tags need to be allowed. You can have the Insert module automatically add required tags and attributes to the CKEditor configuration per the CKEditor plugin provided by Insert. To do so, via /admin/config/content/formats, go to the text format's settings page, which you want to enable Insert module support for. There, drag the Insert module's CKEditor plugin button from the "Available buttons" into the "Active toolbar". If you have not done so already, you will also need to activate Drupal core's Image plugin.

The Insert module's CKEditor plugin will not show a button in the actual editor toolbar as its only purpose is to enabled support for necessary HTML tags and attributes. However, Drupal core's image plugin will render its button. If you do not like this button to show, you can, for example, use custom CSS added to your admin theme.

Note: Enabling the plugins is necessary only when the "Limit allowed HTML tags and correct faulty HTML" filter is enabled for the text format.

Module documentation will be updated along the next release.

Automatically closed - issue fixed for 2 weeks with no activity.

Thanks for the efforts in this area. It's quite tricky to add allowed HTML tags and attributes to CKEditor5!

However, despite adding the Insert module's CKEditor plugin button and the image plugin button to the ckeditor toolbar, the additional insert module allowed HTML tags and attributes are not preserved in CKEditor.

For example, if I click "Source" and add any of the custom attributes to the HTML, the attribute is removed when I click back to the HTML or click to view Source again.

e.g <a data-insert-attach="test">test link</a> or <span class="example">test span</span>

Am I missing something? It should be possible to add those allowed attributes?

Using:

• Insert version: 3.0.0-beta7
• Drupal core: 10.3.0

Adding a screenshot of filter settings

Thanks for the comment. It does not seem that the attributes are being removed at the moment when switching to the source view. Consulting the CKEditor Inspector, the attributes are still there (attached screenshot). However, the attributes are not rendered in the source. Now, when just toggling back to the rendered output without manipulating the source code, the attributes are still attached. Yet, when doing any change to the source, the attributes are dropped when switching back to the rendered output. That is what I can reproduce.

What I just tested is that transferring the Insert attributes manually from the CKEditor Inspector to the source code will retain the attributes when switching back to the rendered view, even when manipulating the source code otherwise. However, the synchronisation of the field's input elements with the field value instances already placed in the editor seems to be lost anyway when switching back to the rendered view. Even inserting a new instance of the field value back in the rendered view, the synchronisation (i.e. updating the text of the link from the title field) seems to be just gone.

Seems like there'd be two tasks:

• render the custom Insert attributes in the source view, and
• re-attach the Insert sync event when switching back to the rendered view (assuming the event is just dropped when switching to the source view).

Though it may also turn out, that supporting the CKEditor source code plugin is just generally out of scope for the Insert module as the source code view sports some different behaviour, which might just be too complex to tie all the knots together. For example: Insert a link, switch to source code, update the link title. Result: The text in the source code is not updated. However, switching back the the rendered output, the link text is updated. These are behaviours which there is most likely no time to make things perfect as well as there does not seem to be a lot of demand for supporting the source view.

Thanks for your reply.

I was looking into the insert implementation to try and extend the allowed html filter attributes in a separate task.

It sounds like the insert module html and attributes are rendering as expected for now and ok.

I will keep in mind the source view behaviour for now, thanks again.