- Issue created by @ryanrobinson_wlu
- π¨π¦Canada ryanrobinson_wlu
Our workaround for now: putting the class on a div wrapped around the details. Messy code but it works until this gets resolved.
- πΊπΈUnited States mlncn Minneapolis, MN, USA
related need: ability to add a class through a template?
- πΊπΈUnited States mlncn Minneapolis, MN, USA
In trying to see what would be needed for this to work, i did some quick hard-coding in
/js/ckeditor5_plugins/detail/src/detailediting.js
:// Convert the <detailSummary> model into an editable <h2> widget. conversion.for('editingDowncast').elementToElement({ model: 'detailSummary', view: (modelElement, { writer: viewWriter }) => { const summary = viewWriter.createEditableElement('summary', { class: 'card-header', }); return toWidgetEditable(summary, viewWriter); }, }); // Convert the <detailWrapper> model into an editable <div> widget. conversion.for('editingDowncast').elementToElement({ model: 'detailWrapper', view: (modelElement, { writer: viewWriter }) => { const div = viewWriter.createEditableElement('div', { class: 'details-wrapper card-body', }); return toWidgetEditable(div, viewWriter); }, });
and those classes do show while editing, but they get stripped by CKEditor. I have tried making changes to allowedContent in
/js/plugins/detail/plugin.js
but it is not helping. I would like to help contribute an admin UI for setting classes and set up the possibility for content editor added/modified classes, but fighting with CKEditor5 and its lack of documentation for something as basic as "how do i let my plugin allow people to add classes without getting them stripped" really saps my motivation. Kudos to the module developers here! (When my search terms went from 'ckeditor5 plugin "allowedContent" any class' to 'ckeditor5 plugin development' and went through the examples and still no answers, i gave up.)(My use case is adding classes for a CSS framework that will always be the same, not an editor setting a class, but the initial steps of wrangling more flexibility out of CKEditor5 are the same.)