Quill: Insert a DIV with insertEmbed

Created on 8 Feb 2017  路  3Comments  路  Source: quilljs/quill

We are conducting a deep test for Quill
So many good ideas in...

But i can't fugure how to insert a div using insertEmbed.

The logical syntax could be quill.insertEmbed(index, 'block', '<div class="myClass"></div>');

If not what means embed ?

And thats what i try but with no results.

Is it necessary to create a new blot or format (very heavy for a simple task) ?
Found http://stackoverflow.com/questions/37525867/how-can-i-add-a-new-format-hr-tag-to-quill-js but is there no simple way to do this ?

Could it be possible to insert any dom element ?

Hope you can help
Best regards

NOTE : It is very important for a WYSIWYG editor to be able to insert dom objects (divs with anything inside including data, active classes, javascript events...).

Most helpful comment

It is not safe, from a bug free and user experience perspective, for a rich text editor to allow arbitrary HTML modifications. This is why vanilla contenteditable and previous generation of rich text editors earned their notoriety and part of the reason Quill was born. The blot abstraction is Quill's way of safely allowing for deep customization on its contents. If you nevertheless prefer the flexibility of arbitrary HTML modifications, other editors with this support still exist.

All 3 comments

It is not safe, from a bug free and user experience perspective, for a rich text editor to allow arbitrary HTML modifications. This is why vanilla contenteditable and previous generation of rich text editors earned their notoriety and part of the reason Quill was born. The blot abstraction is Quill's way of safely allowing for deep customization on its contents. If you nevertheless prefer the flexibility of arbitrary HTML modifications, other editors with this support still exist.

Thank you for this advise.
And is there any sample or documentation on how to create a safe BLOT ?

Cloning Medium with Parchment is a good resource.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

GildedHonour picture GildedHonour  路  3Comments

sferoze picture sferoze  路  3Comments

visore picture visore  路  3Comments

lastmjs picture lastmjs  路  3Comments

lustoykov picture lustoykov  路  3Comments