Create a CKE5 Widget to work with TOC Filter

Created on 18 September 2023, 9 months ago
Updated 28 May 2024, about 1 month ago

Problem/Motivation

I realize to many this may seem silly, but asking some content authors to remember the correct token and type it into the text editor in the right way is asking quite a bit. Also, the documentation for this module is lacking or difficult to find, so users may not immediately know the correct token to use.

Proposed resolution

I suggest creating a submodule or companion module for toc_filter that provides a CKE5 widget for inserting the TOC token into the formatted text field. This will make life easier for content authors as it will create an appropriate block widget with the correct token.

I've created a rough draft of a module that will provide the necessary widget. It is functional but lacks features. What it does is based on my own needs:

- provides a CKE5 editor button that will insert a TOC widget
- provides a contextual UI element for the TOC widget with an option to display the TOC in a block (as opposed to in the formatted text field).

The module currently lacks

- explicit dependence on the top_filter module
- requirement of the toc_filter filter to be active in order to add the widget to the editor toolbar
- an icon for the tool bar button
- additional option in the contextual ui to override the TOC style

I am going to work on the first two items but the other two I don't really need. However, for a proper contributed module these would probably be good to have.

I'm happy to contribute the code I've already written toward the completion of a finished, ready-for-release module. I'm a bit of a novice so I could use some help with the outstanding items. Also, I'm not sure how a contribution like this should work. I see a few options:

- add this module as a submodule of toc_filter and submit a merge request
- add the CKE5 widget as part of the main toc_filter module and submit a merge request
- create my own contributed module separate from toc_filter and describe, in documentation, how the module should be used with toc_filter

Suggestions are welcome.

✨ Feature request
Status

Active

Version

2.0

Component

User interface

Created by

πŸ‡ΊπŸ‡ΈUnited States aaronpinero

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @aaronpinero
  • πŸ‡¬πŸ‡§United Kingdom peter.thorndycraft

    Hey,

    Any luck or progress on this? Did you find an alternative route?

    Peter

  • πŸ‡ΊπŸ‡ΈUnited States aaronpinero

    Hi Peter,

    Yes, I have a working module that I use for one website that I manage. The module still has the limitations I described in the original post, but it works for my limited needs, so I've not had the motivation to work on any of the proposed enhancements.

  • πŸ‡¬πŸ‡§United Kingdom peter.thorndycraft

    Thank you for the reply.
    For anyone visiting this in the future. I did the following and took a couple of minutes:

    1. Run drush gen plugin:ckeditor
    2. Tweak the generated module code (e.g. description, package)
    3. Change this line in the generated plugin /src: editor.model.insertContent(writer.createText('[toc]'));
    4. Enable the new module
    5. Add the new plugin icon to your text editor: /admin/config/content/formats

    Bosh

Production build 0.69.0 2024