Closed 1letter closed 1 week ago
Optional, a filter for transforming the HTML markup of tinymce plugin to bootstraps accordion markup
For a potential implementer, beware that you need the bootstrap js loaded in TinyMCE iframe (or at least a part of it or an helper js) to make it visually editable while TinyMCE has its own js.
Actually, the HTML filter is filtering out data-bs-parent
, data-bs-target
, data-bs-toggle
attributes. Adding them to allowed attributes work only for data-bs-parent
(maybe because it is an attribute of a div?). Disabling html filtering make the BS html code above work. If you remove the show
class from the code above to have the accordion closed by default, with TinyMCE you cannot edit visually the content of the accordion.
This is an example of js helper:
(function($) {
'use strict'; // Start of use strict
$(document).ready(function() {
// TinyMCE accordion template
var collapseElementList = [].slice.call(document.querySelectorAll('#accordion-button-mce'))
var collapseList = collapseElementList.map(function (collapseEl) {
$(collapseEl).on('click', function() {
$(this).toggleClass('collapsed'); // toggle the icon
$(this).attr('aria-expanded', $(this).attr('aria-expanded') === 'true' ? false : true);
var el = $(this).parents().next('div.accordion-collapse.collapse');
return new bootstrap.Collapse(el, {
toggle: true
});
});
});
});
})(jQuery); // End of use strict
Everything has been merged, right? Or is something still left to be done?
One thing perhaps: shouldn't the upgrade step also be run in Plone 6.0? 6.0 and 6.1 use the same plone.base
version.
Indeed, in a coredev 6.0 Plone Classic site that was created earlier:
accordion
.zope.schema._bootstrapinterfaces.WrongContainedType: ([ConstraintNotSatisfied('accordion', '')], 'value')
@mauritsvanrees yes, you are right, only if the next release version is 6.0.x and not 6.1. What should i do, i'm not sure? Should i remove the upgrade step from Plone 6.1 and move it to Plone 6.0 in plone.app.upgrades?
It is needed in both places. Just copying the zcml lines should work fine.
All merged, and will end up in the Plone 6.0 and 6.1 release that I have planned for this week.
But how do I use this? After I enable accordion, I see no change in TinyMCE.
All merged, and will end up in the Plone 6.0 and 6.1 release that I have planned for this week.
But how do I use this? After I enable accordion, I see no change in TinyMCE.
https://github.com/collective/collective.outputfilters.tinymceaccordion
@mauritsvanrees the changes in the Interface is only an infrastructure work. It opens the Option to use the accordion, but the real use should happen via an addon. It means not so much "bloat" in the defaults of tinymce.
I started a new PR to capture documentation of required upgrade steps: https://github.com/plone/documentation/pull/1655
I think we should add a description block to the tinymce controlpanel which tells the user, that he has to do several additional steps if he activates special plugins (eg. templates, accordion etc.) and add a link to the documentation there.
see https://github.com/plone/plone.base/issues/62 see https://github.com/plone/plone.app.upgrade/issues/324
What should changed?
IFilterSchema
andITinyMCEPluginSchema
What is also needed?
an upgradestep to inject the new values to registry
Optional, a filter for transforming the HTML markup of tinymce plugin to bootstraps accordion markup. But this filter can be implemented by anyone if required.
TinyMCE Accordion Plugin generates the following markup per default:
Bootstrap 5 use this markup
Upgrade step should contain: