Q3, 2023 — Better Rich Text Editor
complete
Aurélien Georget
Summary
The current and previous (v3) WYSIWYG editor are more so basic markdown editors and while markdown is awesome (since I'm writing this feature request in markdown smile ) I believe there is room for improvement and we could swap the default editor shipped with Strapi for something more feature rich and complete.
There is already community options in both v3 and v4 such as CKEditor 5, React MD, Toast UI, and Editor.js I do think we should ship something more feature complete then forcing everyone to install one of the community options.
If anything we could also make it easier to swap out our editor by standardizing methods to build new editors into the Strapi interface.
Why is it needed?
Our current editor only supports the bare minimums in terms of markdown support (eg no tables, ect) and support for things like inline youtube video previews, ect are a bit more complex to handle properly.
Likewise not all non-technical content editors are familiar or like markdown. Likewise in many frontend frameworks a library is required to convert markdown to html. I believe it could be possible to handle this type of conversion server side and maybe caching those outputs (or pregenerating them).
Aurélien Georget
Hey everyone 👋
It's Aurélien from Strapi, we released an alpha version today (v14) with a new field type called Blocks. Try it out and share your feedback on Discord or here. It's based on Slate and provides the same capabilities as any rich-text editor. In the beta, we plan to support links, markdown, keyboard shortcuts (Notion-like), and an expanded view.
✌️
A
Alagunasalahaddin
Which Rich Text Editor is it using and how can we extend it?
Yannis Kadiri
complete
J
John Zambrano
This is great. Lexical might be worth investing in although it being still very new. You can provide the same feature as what Payload cms is doing with their block editor where you can insert custom components created in the CTB as blocks in the editor.
I think you should also keep the current editor field for backwards compatibility so developers don't need to reimplement the frontends and also so admin users can choose the type of editing experience they want via the CTB.
Dennis Lizarzaburu
I really love the new Editor; the concept is fantastic and flexible. However, today, I tried to implement an editor inside my application to update the blocks through the API. After hours of searching, I didn't find a good solution for a Vue Editor. The Slate Editor is primarily written for React, making it challenging to integrate into other frameworks such as Vue, Angular, Svelte, and so on. Therefore, I currently see these blocks as a suitable solution for backend editors only.
Have you planned for this limitation? Do you know of a good alternative that can be used with other frameworks? It doesn't need to have the same features as direct Strapi integration (images, internal links, etc.), but I'm looking for basic text editing functionalities that provide the same JSON structure.
K
Kontakt
In the backoffice it easy to used the block editor. But what frontend editor should be used?
E
Euan Robertson
I'm looking to swap out my EditorJS editor for a different implementation (the undo/redo just isn't robust enough) and was waiting until this feature appeared to start working on it. Now that Strapi has settled on Slate, I was looking to start working on customising the editor for my own needs, adding additional tools, etc.
Does the roadmap for the Blocks editor include customisation via Slate plugins? If not, will the editor be available as a separate package that can be forked and customised ourselves? Should I just start building my own Slate based editor?
Lukas Zbinden
Just started looking into that today (what a coincidence 😊) and had to try it out. Looks good so far and the inline preview works well.
What I noticed is that the field in the content type overview displays the content as a long [object Object] string.
Btw: I see that you're planning on converting the text to different formats.
Maybe a dropdown in the content type builder field settings to select what the desired api return value could be nice for that.
For my use case it would be awesome to then be able to fetch the generated md for example and use it with nuxt content.
Aurélien Georget
Hey everyone 👋
It's Aurélien from Strapi, we released an alpha version today (v14) with a new field type called Blocks. Try it out and share your feedback on Discord or here. It's based on Slate and provides the same capabilities as any rich-text editor. In the beta, we plan to support links, markdown, keyboard shortcuts (Notion-like), and an expanded view.
✌️
Greg Tyree
Q3 will end pretty soon. Are there any updates on the progress? It would be helpful for example to at least know which editor you have chosen so teams can start preparing. Thanks.
Martin Lukasik
Aurélien Georget, have you considered using Ghost's Koenig editor?
Demo page: https://koenig.ghost.org
GitHub repo: https://github.com/TryGhost/Koenig
Aurélien Georget
Martin Lukasik: I don't think so. However, we made an heavily benchmark. We are currently hesitating between Lexical and Slate. Any recommandation/suggestion?
Suraj Pokhrel
Aurélien Georget lexical is so good.. i would love to see it in near future.. specially table is most needed in current block editior
Load More
→