You won't want to miss out on the world-class speakers at TNW Conference this year 🎟 Book your 2 for 1 tickets now! This offer ends on April 22 →

This article was published on May 30, 2012

WYSIHTML5: An open source rich text editor based on HTML5


WYSIHTML5: An open source rich text editor based on HTML5

WYSIHTML5, cleverly named after the well known acronym for what you see is what you get (WYSIWYG), is an open source rich text editor based on HTML5 and the progressive-enhancement approach. Functionally, at first look, this editor behaves just as a standard WYSIWYG would, but WYSIHTML5 packs a distinct set of sophisticated features that let it generate fully valid HTML5 markup.

For Web designers and developers, integrating the editor into your site is actually surprisingly easy. As you can see in these step by step instructions, all you have to do is insert a few scripts, paste in the code to create a textarea and toolbar, initialize the editor and then style it with CSS.

All the features, according to the creator:

  • It’s fast and lightweight (smaller than TinyMCE, Aloha, …)
  • Auto-linking of urls as-you-type
  • Generates valid and semantic HTML5 markup (even when the content is pasted from MS Word)
  • Uses class names instead of inline styles
  • Unifies line break handling across browsers
  • Uses sandboxed iframes in order to prevent identity theft through XSS
  • Speech-input for Chrome
  • No jQuery required

So far, the rich text editing interface is supported in IE8+, FF 3.5+, Safari 4+, Safari on iOS 5+, Opera 11+ and Chrome, with graceful degradation for other browsers. According to the Github page, Basecamp and XING have already started using WYSIHTML5 and you can see a demo of it here and here.

The <3 of EU tech

The latest rumblings from the EU tech scene, a story from our wise ol' founder Boris, and some questionable AI art. It's free, every week, in your inbox. Sign up now!

If you’re looking for an HTML5 WYSIWYG editor, this may be your best choice:

➤ WYSIHTML5

Get the TNW newsletter

Get the most important tech news in your inbox each week.