Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

quill add tooltip on custom blot

Tags:

quill

I can't figure out how to add a tooltip on a created custom blot. Something like what is natively happening on links

enter image description here

My custom blot is displayed in the text editor with cusom tag

   class CustomBlot extends BlockEmbed {
          static create(value) {

            let node = super.create();
            node.setAttribute('object', "instrument");
            node.setAttribute('id', value.id);
            node.innerHTML = `
            <div class="btn-group">
              <button class="btn btn-sm btn-outline-info">${value.name}</button>
            </div>
            `;
            return node;
          }

          static formats(node) {
            return node.getAttribute('id');
          }
        }
        CustomBlot.blotName = 'custom';
        CustomBlot.tagName = 'my-custom-tag';
        Quill.register(CustomBlot);

So the inserted code in my editor is between these tags

<my-custom-tag>some html</my-custom-tag>
like image 696
lil-works Avatar asked Oct 16 '25 11:10

lil-works


1 Answers

I know it's been a while, but for anyone interested in the subject, please, see the following link:

https://github.com/loagit/Quill-Examples-and-FAQ

like image 197
Loa Avatar answered Oct 19 '25 08:10

Loa