@editorjs/simple-image

Simple Image Tool for Editor.js 2.0

Showing:

Popularity

Downloads/wk

3.7K

GitHub Stars

28

Maintenance

Last Commit

6mos ago

Contributors

11

Package

Dependencies

0

Size (min+gzip)

5.3KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Reviews

Top Feedback

1Poor Documentation

Readme

Simple Image Tool

Provides Image Blocks for the Editor.js.

Works only with pasted image URLs and requires no server-side uploader.

Installation

Install via NPM

Get the package

npm i --save-dev @editorjs/simple-image

Include module at your application

const SimpleImage = require('@editorjs/simple-image');

Download to your project's source dir

  1. Upload folder dist from repository
  2. Add dist/bundle.js file to your page.

Load from CDN

You can load specific version of package from jsDelivr CDN.

https://cdn.jsdelivr.net/npm/@editorjs/simple-image@latest

Then require this script on page with Editor.js.

<script src="..."></script>

Usage

Add a new Tool to the tools property of the Editor.js initial config.

var editor = EditorJS({
  ...
  
  tools: {
    ...
    image: SimpleImage,
  }
  
  ...
});

Config Params

This Tool has no config params

Tool's settings

  1. Add border

  2. Stretch to full-width

  3. Add background

Output data

FieldTypeDescription
urlstringimage's url
captionstringimage's caption
withBorderbooleanadd border to image
withBackgroundbooleanneed to add background
stretchedbooleanstretch image to screen's width
{
    "type" : "image",
    "data" : {
        "url" : "https://www.tesla.com/tesla_theme/assets/img/_vehicle_redesign/roadster_and_semi/roadster/hero.jpg",
        "caption" : "Roadster // tesla.com",
        "withBorder" : false,
        "withBackground" : false,
        "stretched" : true
    }
}

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation1
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
Dominik VrbicMaastricht, Netherlands1 Rating0 Reviews
Software Engineering Team Lead at Dephion
9 months ago
Poor Documentation