Rich Text Editor on TableBlock

[jkevingutierrez]

Is your proposal related to a problem?

It would be great to be able to edit cells on the TableBlock using a Rich Text Editor, not just plain text (sometimes you want to have links, italic, bold, lists, etc)

Describe the solution you'd like

Here is a simple example of a rich text editor using Quilljs in a cell of Handsontable http://jsfiddle.net/ouabc4y5/ (The example doesn't work because it seems to be using old CSS and JS Handontable links. To run it, it is necessary to replace them for the ones used here https://handsontable.com/download)

Even though we could implement a custom Rich Text Editor like Quilljs, it would be good to have it implemented on Wagtail and having it integrated with Draftail to have all the benefits of using it (Like the Interface for adding images and links)

(Describe your proposed solution here.)

It would be good that having the next configuration:

new_table_options = {
   ...
    'editor': 'richtext',
    'renderer': 'html',
}
...
    
table = TableBlock(table_options=new_table_options)

Will enable a RichTextEditor on the TableBlock cells, using Draftail.

Here is the Handonstable documentation for creating Custom Editors.

[joegarlick]

We would also love this. Time and time again we come up against this restriction and our content designers are having to do things like add links below a table when they should be in a cell. Linked content is much better for SEO and the user and I hope this gets implemented soon.

[thibaudcolas]

This has been implemented in Wagtail 2.15 as a new block type, TypedTableBlock. There are more improvements in the works for this but I believe it already serves this use case well enough. I believe we’re unlikely to implement this with Handsontable due to its licensing changes, which mean we’re stuck with a relatively old / legacy version in Wagtail.

For future reference, I had also prototyped table support directly in Draftail and was pretty happy with it. This was just a prototype however – there would be a lot more work needed to support all expected keyboard and context menu interactions.

[tanveerahmad1517]

Hello @thibaudcolas How can I implement directly in Draftail in table in wagtail editor I want table with bold italic table data by default TableBlock is not supporting bold italic table data please help
Thank You.

[zerolab]

Please follow the documentation https://docs.wagtail.org/en/stable/reference/contrib/typed_table_block.html

[tanveerahmad1517]

I have asked Question on Slack
Table contents are formatted as blog post in docx file I just want copy are paste in editor typed_table_block is not giving us such things it needs to add every time table data columns every time 😞 it doesn't make sense for me

@zerolab
Got answered
Ah, that is a much more complex problem that Wagtail doesn't really have a solution for at this time.

[zerolab]

@tanveerahmad1517 I understand your issue, but please read https://torchbox.com/blog/rich-text-fields-and-faster-horses/
The short version is: we do not support and will not make the rich text editor support all the bells and whistles. StreamField is much better suited for a lot of the "I want to be able to change everything via the text editor" requirements. It is an unnecessary burden on the core developers, but also site developer.

It is worth noting that Wagtail supports other rich text editors, and people have created third-party packages for that. And that is wonderful! We provide the mechanisms and tools for people to extend the Wagtail functionality and it is up to individual developers to customise things the way they need it.

Please continue the discussion on Slack. There are some solutions that could work for you.