Skip to content
/ editor Public

A basic inline HTML editor based on the medium.com authoring experience.

Notifications You must be signed in to change notification settings

mjbp/editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

73 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

#editor A basic inline HTML editor based on the [medium.com] (medium.com) authoring experience.

Demo: [http://mjbp.github.io/editor] (http://mjbp.github.io/editor)

##Features Adds contentEditability on the fly

###HTML and Styles

  • Bold, italic, blockquote, h1-h6, and link in pop-up editor menu
  • Ordered list when hit enter on a line starting '1.'
  • Unordered list when hit enter on a line starting '- '
  • Horizontal rule when hit enter twice on new line

###Headers Treat headers differently to article body text - add editability but not the toolbar

###Placeholders Supports placeholder text for editable elements

##Usage Include editor.js and style.css

Instantiate a new Editor object passing css selector (those supported by document.querySelectorAll())

var editor = new Editor('.editable');</script>

In this example all elements with the className 'editable' will be rendered contentEditable and the toolbar enabled.

###Options Add editability but not the toolbar by adding 'editor-heading' class to an element:

    <header class="editable editor-heading"></header>

Set the HTML and style formatting you would like (the buttons shown on the toolbar) to use by passing them to the editor constructor:

    var editor = new Editor('.editable', {
            buttons: ['b', 'i', 'blockquote', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'a', 'cancel']
        });

##Browser support Developed and tested in latest builds of Chrome and Firefox.

About

A basic inline HTML editor based on the medium.com authoring experience.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published