統合マークダウンWYSIWYGテキストエディター
Markdownコード用の簡単なWYSIWYGエディターを探しているときに、CkEditor、TinyMCEなどと比較できるUIが見つかりません。
具体的には、多くの場合推奨されるMarkdown「WYSIWYG」エディター（ this などの投稿）は、ユーザーが未加工のMarkdown（ MarkItUp を記述するという意味で、純粋なWYSIWYGエディターではありません）または、標準のコントロールなしでインライン編集を行う他の極端な方法に進みます（ Hallo ）。
間に何かが必要です。
私は、CkEditorテキストボックスを削除したような外観と機能を持ち、Markdownを受け入れて出力するMarkdownエディターを探しています。最小限の書式設定オプション（B、I、U、リスト、ect）が設定されたツールバーがあり、テキスト入力エリアには生のコードではなく、変換されたマークダウンが表示されます。ユーザーが未加工のマークダウンを編集できるようにするソースボタンがあるはずですが、それもオプションです。例：
Markdown/wikiなどの理由がわかります-それが提供するセキュリティです。ここでSEのように生のコードを入力することは構いませんが、ユーザーはオタクではなく、これが楽しいとは思いません。彼らは* * * ___とテキストに混在するスペースを見たくありません。これらは「Word」スタイルの編集に使用され、その環境で最も生産的です。
それで、Markdown用の真に統合されたWYSIWYGエディターはありますか？私はPHPで書いているので、クラスで呼び出すことができるものは完璧でしょう。
2015年9月23日更新
CKEditorには、Markdownaddon があり、これはまさにこのことを行います。アドオンプロジェクトは githubでホスト です。
スクリーンショット：
2015年4月13日更新
CKEditorの開発を公言している人は、 CommonMark の出現はゲームチェンジャーであり、適切な CKEditorのマークアップインターフェース （コメントを読む全文）。
2015年2月6日更新
CKEditorには、BBCodeを出力する（および入力として受け入れる）プラグインが付属しています。
私は先日このテーマで研究していましたが、Markdown出力を備えたまともなWYSIWYGエディターは見つかりませんでした。実際、最初にWYSIWG Markdownエディターを作成する必要があります。これはWYSIWG HTMLエディターであり、市場で使用できるものはごくわずかです。
HTMLエディターをMarkdownエディターに変更するCKEditorのdataProcessorを作成できる可能性があります。このように動作するBBCodeのプラグインがあります（チェックアウト http://nightly-v4.ckeditor.com/3737/samples/bbcode.html ）。
必要なのは、このインターフェイスを実装することだけです http://nightly-v4.ckeditor.com/ckeditor_api/#!/api/CKEDITOR.dataProcessor 。 BBCodeプラグインのコードを確認すると、残念ながら現在のCKEditorのアーキテクチャでは（まだ）そのようなデータプロセッサを作成する準備ができていないため、いくつかのハッキングやトリックが表示されます。ただし、いくつかのスタイリングオプションのみを提供する場合は、Markdownサポートを非常に迅速に実装できるはずです。
SimpleMDE 、新参者が答えかもしれません。私は今、このようなものを1か月間探しています。これが検索結果の上位に表示されないことに驚いています。これを見つけるには lepture/editor の通知を確認する必要がありました。
2015年9月23日編集
CKEditorには、Markdownaddon があり、これはまさにこのことを行います。アドオンプロジェクトは githubでホスト です。
スクリーンショット：
2015年2月6日の更新で投稿したように、 CKEditor にBBCodeの入出力を許可するプラグインが含まれるようになりました。
デモはこちらから入手できます。 http://ckeditor.com/demo#bbcode
2015年4月13日編集：
CKEditorの開発を公言している人は、 CommonMark の出現はゲームチェンジャーであり、適切な CKEditorのマークアップインターフェース （コメントを読む全文）。
Penは、新しい（2014年現在アクティブな）WYSIWYGエディターです。 markdownを出力します。
完璧ではありません。HTMLの貼り付けに問題がありますが、機能します。
編集：ごめんなさい！ Markdownを出力しません。Walery Strauch 私が見たMarkdownフォーマット記号は実際にはCSS擬似要素ルールであるというコメントで指摘されています：
それでも、一部の人々はこの答えを支持し、誰かに役立つかもしれないので、ここにオプションとして残しておきます。
Markdownを含む<textarea>のコンテンツをWYSIWYG方式で編集できる非常にシンプルなエディターを実装しました。
Hallo を使用しました。そのWebサイトが、それ自体がMarkdown WYSIWYGエディターではなく、 demo がそのパスを偽造していることを明らかにしているとは思いません。
Hallo は、<div>内のHTMLのWYSIWYG編集を許可します。 JavaScriptを使用して、特定のwysiwyg CSSクラスを持つ<textarea>ブロックを非表示にし、<div>に置き換え、<textarea>の内容を<div>にコピーしました。コピーは、MarkdownからHTMLを生成する Showdown を実行します。
<div>の内容が変わるたびに、別のJavascriptルーチンが反応します。内容を（現在非表示の）<textarea>にコピーします。コンテンツは to-markdown を通過して、HTMLからMarkdownに変換されます。
<textarea>が<form>のフィールドである場合、そのフォームが送信されると、編集されたマークダウンがサーバーに送信されます。
これのインスピレーションは、 Hallo Markdown Example 、具体的には editor.js ファイルから来ています。私はそれを hallo.js 、 showdown.js とともに 自分のスクリプト の基礎として使用し、 to-markdown.js 。
私のスクリプト wysiwyg.js は、 Hallo Markdown Example からの editor.js の派生物です。注意すべき点：
- これをRailsアプリケーションで使用します（それは重要ではありません）
readyとpage:loadで実行されます。後者はRailsがTurbolinksを使用するためです。- フォームエラーレポートにAjaxを使用しているため、
ajaxCompleteで実行されます。 - 他の依存関係があります： JQueryUI および Rangy （Railsユーザーはgem jquery-ui-Rails および rangy-Rails ）。
- また、ツールバーアイコンには Font Awesome が使用されます。 demo で使用される
hallo.jsのバージョンは古くなっています（古いバージョンの Font Awesome を使用）- halloを使用します代わりにGitHub の.js。
CSSのclass='wysiwyg'を<textarea>に追加するだけで、WYSIWYGを有効にすることができます。 <textarea>は、Markdown形式のテキストを含む必要があります。
HTMLで動作する限り、 Hallo が気に入らない場合は、 wysiwyg.js を別のエディターを使用するように簡単に適応できると思います<div>で。選択できるものはかなりありますが、すべてが Hallo ほど軽量ではありません。
私が見つけたわずかな作品は、 markdown-html-form です。同じ Showdown と to-markdown を使用します。
このスレッドの上部に記載されているマークダウンエディターも探しています。
「マークダウンツール」を見ましたか？ http://md-wysiwyg.sourceforge.net/
デモ： http://md-wysiwyg.sourceforge.net/cgi-bin/cgi_wysiwyg_test.py/
これは私たちが探しているものにかなり近いように見えます。WYSIWYGリッチテキストを取得してマークダウンを出力する合理的な仕事をします。ただし、Googleドキュメントからリッチテキストを貼り付けたときに、エンコードの例外で失敗しました。