a coder a coder - 7 months ago 80
Markdown Question

Integrated Markdown WYSIWYG text editor

In looking for a straightforward WYSIWYG editor for Markdown code, I am not finding a comparible UI to that of CkEditor, TinyMCE, ect.

Specifically, the Markdown "WYSIWYG" editors that are often recommended (such as posts like this ) are not pure WYSIWYG editors in the sense that users either still write raw Markdown ( MarkItUp ) or go to the other extreme of having in-line editing without standard controls ( Hallo ).

I need something in-between.

I'm looking for a Markdown editor that looks and functions like a stripped down CkEditor text box, and that accepts and outputs Markdown. There should be a toolbar with a minimum set of formatting options (B, I, U, lists, ect), and the text entry area should show the converted Markdown, not the raw code. There should be a Source button that will allow users to edit the raw Markdown, but even that is optional. Ex:

enter image description here

I get the reason for Markdown/wiki, ect - the security it offers. I don't mind entering raw code like here at SE, but my users are not geeks and do not find this enjoyable. They don't want to see * * * ___ and spaces mixed in with their text. They are used to "Word" style editing, and are most productive in that environment.

So - is there a truly integrated WYSIWYG editor for Markdown? I'm writing in a PHP, so something that I can invoke with a class would be perfect.

Sept 23, 2015 Update

CKEditor now has a Markdown addon that does this exact thing. The addon project is hosted on github.


markdown WYSIWYG

markdown source

Apr 13, 2015 Update

Someone professing to develop CKEditor says that the appearance of CommonMark is a game changer, and we could possibly see a proper markup interface for CKEditor (read comments for the full story).

Feb 6, 2015 Update

CKEditor now comes with a plugin that outputs (and accepts as input) BBCode.

Demo: http://ckeditor.com/demo#bbcode

Answer Source

I was researching in this subject the other day and I haven't found any decent WYSIWYG editor with Markdown output. In fact, first you have to have to create a WYSIWG Markdown editor is WYSIWG HTML editor and there are just few of them that are usable on the market.

There's a chance that you'll be able to create dataProcessor for CKEditor that will change HTML editor into Markdown editor. We've got a plugin for BBCode that works like this (check out http://nightly-v4.ckeditor.com/3737/samples/bbcode.html).

All you have to do is implement this interface http://nightly-v4.ckeditor.com/ckeditor_api/#!/api/CKEDITOR.dataProcessor. If you check BBCode plugin's code you'll see some hacks and tricks, because unfortunately current CKEditor's architecture isn't ready (yet) to create such a data processor. However, I believe that if you want to provide only few styling options you should be able to implement Markdown support pretty quickly.