This module provides an integration layer of a standalone CKEditor 4 plugin. As of this writing, there is no CKEditor 5 equivalent plugin, and nothing in the issue queue indicates work is underway or even planned. As such, there are 3 possible courses of action:

Options

1. Create an in-house CKEditor 5 plugin from the ground up.
2. Switch to using https://www.drupal.org/project/ckeditor5_embedded_content (which would require creating a plugin implementation that renders a div).
3. Approximate the functionality by using CKEditor's "Source" mode + the "Styles" dropdown.

1. In-house plugin

The only option for true feature equivalence would be to create a in-house CKEditor 5 plugin. There are some good models in CKEditor 5 documentation for this:

1. The "Abbreviation Plugin" tutorial provides an example of a toolbar item that provides a balloon for user input and inserts HTML. Demo here: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/plugins/abbr...
2. The "Block widget" tutorial demonstrates inserting more predefined HTML. Demo here: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/tutorials/im...

2. Replacement: CKEditor5 Embedded Content

https://www.drupal.org/project/ckeditor5_embedded_content

3. Approximated functionality

For others coming here, this Drupal module's functionality could be approximated without a dedicated plugin by having content editors insert a plain div tag using the CKEditor "source" mode, and then using the "Styles" dropdown to apply a predefined CSS class to that div.

Note that CKEditor 5 compatibility should be considered distinct from Drupal 10 compatibility, which is a separate issue (#3334280: Create new version to D10), and can be completed on its own, with the caveat being that sites would need to use the contrib-provided CKEditor 4 module with Drupal 10: https://www.drupal.org/project/ckeditor

CommentFileSizeAuthor
#11 4.diff328.7 KBloopy1492

Issue fork ckeditor_div_manager-3322722

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

kepesv created an issue. See original summary.

mark_fullmer’s picture

mark_fullmer
he/him
Primary language English
Location Tucson
commented
Title: Ckeditor 5 compatibility » CKEditor 5 Compatibility
Issue summary: View changes

Foxy-vikvik made their first commit to this issue’s fork.

Foxy-vikvik opened merge request !3

mark_fullmer’s picture

mark_fullmer
he/him
Primary language English
Location Tucson
commented

It looks like the latest commit to the MR is a partial, but incomplete rework of the example plugin in https://ckeditor.com/docs/ckeditor5/latest/framework/tutorials/implement... ?

Beyond the fact that the code itself looks like it's still got placeholder content, I'm getting a JS error when attempting to test (tested with Drupal 10.0.x and 10.1.x, which support different versions of CKEditor 5):

Uncaught TypeError: Cannot read properties of undefined (reading 'maxOffset')
    at zo._createAt (ckeditor5-dll.js?v=37.1.0:5:215958)
    at er.insert (ckeditor5-dll.js?v=37.1.0:5:358053)
    at er.append (ckeditor5-dll.js?v=37.1.0:5:358971)
    at divManagerPlugin.js?ruwzkh:1:1177

That said, this *does* successfully register the plugin within Drupal, and it can be placed in the toolbar of a CKEditor instance!

Could you provide more information about the state of the merge request right now and plans for completion?

foxy-vikvik’s picture

foxy-vikvik commented

@mark_fullmer still working on it. The structure was changed.
If you have any suggestion Could you please add it here.

foxy-vikvik’s picture

foxy-vikvik commented
Status: Active » Needs review
loopy1492’s picture

loopy1492 commented

I'd really like to help review this, but it needs to be rebased with 2.1 for Drupal 10 compatibility.

loopy1492’s picture

loopy1492 commented
Version: 2.0.x-dev » 2.1.0

loopy1492 opened merge request !4

loopy1492’s picture

loopy1492 commented
StatusFileSize
new 4.diff328.7 KB
loopy1492’s picture

loopy1492 commented

I am not sure why none of the 2.1.0 patches are working. I just downgraded to 2.0 and added this module to drupal-lenient for now.

loopy1492’s picture

loopy1492 commented

I really want to help out here, but I need a 2.1.x-dev branch I can point to on drupal.org. All the patches fail against 2.1.0 because there's stuff in 2.1.x which we have to compare to in the MR.

loopy1492’s picture

loopy1492 commented

I managed to get this running by using the old method of setting gitlab as a repository in composer and referencing my branch.

So, I noticed that this project still has the old ckeditor 4 module as a dependency and I wondered where that was coming from. It looks like this is still a dependency:

https://www.drupal.org/project/ckeditor_libraries_group
https://github.com/drupal-ckeditor-libraries-group/div

Who knows if this would still work or if it will ever be updated or even if it is needed anymore.

milos.kroulik’s picture

milos.kroulik commented
Status: Needs review » Needs work

It looks like the MR is basically working, but when the inserted div is edited again, class (and possibly other attributes which I haven't tested) are missing. When editing existing div, the UI appears only on button click, which is different from other similar modules, which generally use contextual menu above the respective element (but this is a small issue, I would say).

smulvih2 made their first commit to this issue’s fork.

smulvih2’s picture

smulvih2
Location Canada 🍁
commented
Status: Needs work » Fixed

Thanks everyone for all the effort to get this going. I tested the MR with CKE5 and it works pretty well. We do need to look at allowing the dialog to be called when interacting with an existing div, so users are not forced to use the Source button. I created a 3.0.0-alpha1 release with changes from MR#4. I'm going to mark this ticket as Fixed since it works with CKE5, and open new tickets for any changes that are needed.

smulvih2 closed merge request !4

Status: Fixed » Closed (fixed)

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

sahilgidwani’s picture

sahilgidwani commented

Can anyone help me here with how to migrate existing ckeditor div manager from CK4 to CK5 on a existing site.

sime’s picture

sime
any/any
Location Melbourne
commented

Just researching this module and wanted to note that the project page reads like you need to install the cke4 plugin for the 3.x branch. Even in the README some instructions about cke4 have been removed, but it still says "Download the Div Container Manager
CKEditor plugin." in the manual instructions.

sime’s picture

sime
any/any
Location Melbourne
commented

I've opened a new issue for the documentation problem https://www.drupal.org/project/ckeditor_div_manager/issues/3397578

brad.bulger’s picture

brad.bulger commented

Is comment 17 above saying that at the moment there is no edit capability, only create? That's how it is working for me.