An extension that inserts custom HTML using a new button in the Medium Editor toolbar
HTML JavaScript CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
src Updated minified code Apr 9, 2015
test Some CSS stuff Jun 18, 2014
.gitignore Added gitignore Jun 18, 2014
LICENSE 🎆 Bumped the license year Apr 9, 2015 Link to preview page Jun 18, 2014
package.json ⬆️ 1.1.0 Apr 9, 2015


Insert custom HTML using a new button in the Medium Editor toolbar


Check out the demo page hosted on GitHub pages.


new CustomHtml(options)

Creates a new instance of CustomHtml extension.


  • Object options An object containing the extension configuration. The following fields should be provided:
  • buttonText: the text of the button (default: </>)
  • htmlToInsert: the HTML code that should be inserted


The click event handler that calls insertHtmlAtCaret method.


This function is called by the Medium Editor and returns the button that is added in the toolbar


  • HTMLButtonElement The button that is attached in the Medium Editor toolbar


Load in the page the following scripts in this order:

  • Medium Editor JS
  • Custom HTML Medium Editor Extension
  • Your custom script (that creates the editor and contains the custom handlers)
window.onload = function () {
    var myEditor = new MediumEditor(".container", {
        buttons: [
          , "italic"
          , "underline"
          , "anchor"
          , "header1"
          , "header2"
          , "quote"
          , "customHtml"
      , extensions: {
            "customHtml": new CustomHtml({
                buttonText: "<hr>"
              , htmlToInsert: "<hr class='someclass'>"


Run the following commands to download and install the extension:

$ git clone medium-editor-custom-html
$ cd medium-editor-custom-html
$ npm install

How to contribute

  1. File an issue in the repository, using the bug tracker, describing the contribution you'd like to make. This will help us to get you started on the right foot.
  2. Fork the project in your account and create a new branch: your-great-feature.
  3. Commit your changes in that branch.
  4. Open a pull request, and reference the initial issue in the pull request message.


See the LICENSE file.