Editor.js | A Lightweight and Clean WYSIWYG Editor with JavaScript

Editor.js is a lightweight and simple WYSIWYG Html/Text editor, it is easy to use.

How to create a simple editor using Editor.js?

1.Import css/editor.min.css and editor.min.js in your html page

<link rel="stylesheet" href="css/editor.min.css">
<script src="js/editor.min.js"></script>

2.Create a html containor to show WYSIWYG editor

<div id="editor">
  <div id="tools">
    <button title="Clear formatting" id="clear">C</button>
    <button title="Insert header" id="heading">H</button>
    <hr>
    <button title="Italic" id="italics">I</button>
    <button title="Bold" id="bold">B</button>
    <button title="Underline" id="underline">U</button>
    <button title="Strikethrough" id="strikethrough">S</button>
    <hr>
    <button title="Unordered list" id="ul">ul</button>
    <button title="Ordered list" id="ol">ol</button>
    <hr>
    <button title="Insert video" id="video">vid</button>
    <button title="Insert image" id="image">img</button>
    <button title="Insert Gfycat" id="gfy">gfy</button>
    <hr>
    <button title="Insert horizontal line" id="hr">hr</button>
  </div>
  <div id="input" contenteditable="true"></div>
</div>