Jump to content

New post – Reconsidering the CKEditor 4 to 5 upgrade


ryan
 Share

Recommended Posts

@Pixrael I have in the past, though they've never had a compatible license. They make great stuff. But for things like this I tend to stick to things that have a GitHub repo and compatible license. I've always seen Redactor as something that would be good for a 3rd party module rather than a core inclusion. 

  • Like 1
Link to comment
Share on other sites

Quote

I consider long term consistency, compatibility and upgradeability to be sacred in PW. I don't fault CKEditor's approach, but it's just not compatible with PW's approach. You won't ever have to "rewrite from scratch" anything in or for ProcessWire, unless you want to.

Loving it 😍

Quote

Actually, I'm not hunting for it anymore... I'm already using it as an Inputfield in ProcessWire here locally (both regular and inline), putting it through its paces, stress testing it with hundreds of instances, and throwing everything I can at it, and so far at least, it is putting a big smile on my face. It's not CKEditor, though has a lot in common with it. If testing continues to be a success, I think you'll be able to start using it in ProcessWire this month. Stay tuned.

You can't do that 😄 What is it? https://github.com/quilljs/quill ? https://github.com/summernote/summernote/ ?

Quote

stress testing it with hundreds of instances, and throwing everything I can at it, and so far at least, it is putting a big smile on my face.

Also, some insights on that part would be especially interesting 🙂 

Fingers crossed for a smooth transition! Thx for all your great work!!

  • Like 10
Link to comment
Share on other sites

Quote

But is the replacement (CKEditor 5) the best path forward?

Let's not forget that CKEditor has many (returning) forum posts/questions about it's behavior and associated hard to find configurations 

Keep in mind that something like CKEditor5 will be just too much for many clients/end users/office workers/
who are in need for a more easy and intuitive to use editor:

https://getcontenttools.com/demo

 

  • Like 1
Link to comment
Share on other sites

11 minutes ago, MrSnoozles said:

My bet goes to the Atlaskit Editor.

I hope not, the editor is used in Atlassian Jira and it is really bad there.
And when the manufacturer already has problems with the editor... 😉 

Link to comment
Share on other sites

On 10/15/2022 at 10:34 AM, Beluga said:

Let's keep guessing and maintain the hype 🤪

Based on this comment:

On 10/14/2022 at 10:20 PM, ryan said:

GitHub repo and compatible license.

Plus activity and familiarity, I am also thinking summernote 😁, or Trumbowyg. Although there is a million other possibilities here.

Edited by kongondo
  • Like 2
Link to comment
Share on other sites

My issue with CKEditor 4 is that the document is saved as HTML, because multiple reasons:

  • The saved HTML code is processed every time you wanna change it.
  • Because is HTML, some (like me 😄) tend to go full power only to be slapped on the fingers by the security checks.
  • Makes programmatic export/import of content less simple than how I would like it.
  • Makes finding if a Processwire element (like an image or file) is included in a CKEditor field less simple than how I would like it.

From what I read, CKEditor 5 and ProseMirror are using a custom data model. I really hope @ryan is considering one for his rich text editor!

Link to comment
Share on other sites

6 hours ago, The G said:

From what I read, CKEditor 5 and ProseMirror are using a custom data model. I really hope @ryan is considering one for his rich text editor!

This is exactly what creates the upgrading problem that Ryan is trying to avoid, since data is in HTML already in all processwire installs.

  • Like 2
Link to comment
Share on other sites

My first reaction: Seriously?! TinyMCE reminded me of my old and awful Joomla days 😅

Then: Ok... that looks nice... Ok... very nice... Ok... that looks great!!

Thank you Ryan for all your great work! Looking forward to using it soon 🙂 

Let's show our love to TinyMCE and star the project on Github https://github.com/tinymce/tinymce

On 10/15/2022 at 12:55 AM, Ivan Gretsky said:

I guess we're going back to TinyMCE)))

Congrats, you are the winner 😄 

  • Like 7
Link to comment
Share on other sites

11 hours ago, ryan said:

Here's all the details:

Thanks a million Ryan!

My highlights:

  • it'll be available to install by or before this time next week
  • Yes there's a dark mode!
  • The toolbar configuration ... via InputfieldTextTags ...
  • plugins are selectable from checkboxes
  • Five UI
  • The inline editor after we click in it
  • Multi-language

I will especially be happy to use Five UI and the inline editor appearing after we click in it, as these options save a lot of screen space which I prefer to whitespace bonanza.

BTW, may I propose that in the "other settings" section we can also have options via InputfieldTextTags wherever appropriate (instead of typing in literals).

  • Like 2
Link to comment
Share on other sites

@ryan CKEditor had a problem when using Frontend Editing. Maybe you can see if TinyMCE has the same issue and address it while you are on it 🙂 

The problem: Let's say you have one "body" field and you want to use it on the "home" and on the "basic-page" template. And let's say you want different toolbars for both templates. Unfortunately the toolbar can not be customised via template context, so I tried the technique that @Robin S showed here: https://processwire.com/talk/topic/17195-customise-ckeditor-toolbar-per-role/

Unfortunately the "getInputfield()" hack does also not work in frontend context - all editors have the same toolbar, the one that is set in the field settings without any template context. For me this is a "serious" problem because I'm using CKE for all kinds of text-input with most of the time very limited toolbars (sometimes only a "bold" button to give editors the option to highlight some words of a headline). Sometimes it's fine to have separate fields for separate contexts, but sometimes it would be nicer to share a common setup and then do only single changes via template context (eg allowing links on one template but not on another or such).

Thx!

Link to comment
Share on other sites

@bernhard I'm not sure I know why that issue occurs in CKEditor, but I don't see any reason why the issue should exist in TinyMCE. I'm sure there's also a way around it in CKEditor, though I don't understand the issue well enough yet to suggest something. Most (maybe all) of the TinyMCE settings should lend themselves very well to context. The way I've got it setup currently is that it maintains all the settings (that differ from the defaults), namespaced by field name in ProcessWire.config.InputfieldTinyMCE.settings. Then any field-template context settings (that differ from the field settings) are in data attributes on the Inputfield. Field settings override defaults, then template-context settings override those. InputfieldCKEditor settings work in a similar way, but with less efficiency (all settings bundled rather than just those that override defaults), and it doesn't have the option for the data attribute override settings. Hopefully TinyMCE will work for the context you mention but let me know if not, I'm sure we'll be able to figure it out. 

  • Like 2
  • Thanks 1
Link to comment
Share on other sites

Great to hear that, thx! I'll not invest any time in why it's not working for me on CKE as I've just built all sites with custom fields and I don't want to refactor that 🙂 I'll let you know if I see any problems on TinyMCE 🙂 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...