Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 25 additions & 21 deletions docs/installation.md
Original file line number Diff line number Diff line change
@@ -1,53 +1,58 @@
# Installation Guide

There are few steps to run Editor.js on your site.
There are three steps to run Editor.js on your site:

1. [Load Editor's core](#load-editors-core)
2. [Load Tools](#load-tools)
3. [Initialize Editor's instance](#create-editor-instance)
3. [Initialize the Editor instance](#create-editor-instance)

## Load Editor's core

Firstly you need to get Editor.js itself. It is a [minified script](../dist/editor.js) with minimal available
First, choose how you want to load Editor.js. Use either a package manager, a CDN, or a local copy of the built file.

Choose the most usable method of getting an Editor for you.
### Use a package manager

- Node package
- Source from CDN
- Local file from a project

### Node.js

Install the package via NPM or Yarn
Install Editor.js with NPM or Yarn:

```shell
npm i @editorjs/editorjs
```

Include module at your application
Then import it into your application:

```javascript
import EditorJS from '@editorjs/editorjs';
```

This method requires a JavaScript project that supports package imports, usually through a build tool or bundler.

### Use from CDN

You can load specific version of package from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/editorjs).
For a browser-only project, load Editor.js directly with a script tag:

`https://cdn.jsdelivr.net/npm/@editorjs/editorjs@2.10.0`
```html
<script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>
```

Then require this script.
After the script loads, `EditorJS` is available as a global variable. Do not also use the package-manager import in the same setup.

```html
<script src="..."></script>
<div id="editorjs"></div>

<script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>
<script>
const editor = new EditorJS({
holder: 'editorjs'
});
</script>
```

### Save sources to project
### Save the built file to your project

Copy [editor.js](../dist/editor.js) file to your project and load it.
You can also download a built browser file from the package's `dist` directory and save it in your project. Load the file with a script tag before creating the Editor.js instance:

```html
<script src="editor.js"></script>
<script src="editorjs.umd.js"></script>
```

## Load Tools
Expand Down Expand Up @@ -83,7 +88,7 @@ var editor = new EditorJS(); /** Zero-configuration */
// equals

var editor = new EditorJS('editorjs');
````
```

Or pass a whole settings object.

Expand Down Expand Up @@ -165,7 +170,6 @@ try {
}
```


## Saving Data

Call `editor.saver.save()` and handle returned Promise with saved data.
Expand Down