Annotation Inline Tool for Editor.js

Allows to add an extended annotation to any text

Preview

- Editor.js v2.30+

Get the package

``

shell

$ npm i editorjs-annotation





Include module at your application

javascript

import Annotation from 'editorjs-annotation';





$3



You can load a specific version of the package from jsDelivr CDN.



Require this script on a page with Editor.js.

html





$3

1. Upload folder

dist

 from repository

2. Add

dist/bundle.js

 file to your page.



Usage

javascript

var editor = EditorJS({

  // ...

  tools: {

    // ...

    annotation: Annotation

  },

  // ...

});





Output data

Annotation will be wrapped with a

span tag. with an cdx-annotation

 class.



Additional data will be store in element's dataset:

data-title, data-text

json

{

    "type" : "paragraph",

    "data" : {

        "text" : "Nuclear power plants have a carbon footprint..."

    }

}

Allows to add an extended annotation to any text

- Editor.js v2.30+

Get the package

``

shell

$ npm i editorjs-annotation





Include module at your application

javascript

import Annotation from 'editorjs-annotation';





$3



You can load a specific version of the package from jsDelivr CDN.



Require this script on a page with Editor.js.

html





$3

1. Upload folder

dist

 from repository

2. Add

dist/bundle.js

 file to your page.



Usage

javascript

var editor = EditorJS({

  // ...

  tools: {

    // ...

    annotation: Annotation

  },

  // ...

});





Output data

Annotation will be wrapped with a

span tag. with an cdx-annotation

 class.



Additional data will be store in element's dataset:

data-title, data-text

json

{

    "type" : "paragraph",

    "data" : {

        "text" : "Nuclear power plants have a carbon footprint..."

    }

}