Web上でコンテンツを見たままに編集「Pen」
PenはJavaScript製のオープンソース・ソフトウェア（MIT License）です。
管理画面でコンテンツを編集して、ユーザ画面で確認したら思わぬ表示の乱れが生じていたなんて経験はCMSの運用担当者であれば誰しもがあるはずです。やはり編集画面と表示画面の分離は問題があるのではないでしょうか。そこで使ってみたいのがPenです。
[](http://images.moongift.jp/2013/09/Screenshot 2013-09-07 14.32.27.1378563457.png)
テキストを選ぶとツールバーが表示されます。
[](http://images.moongift.jp/2013/09/Screenshot 2013-09-07 14.32.40.1378563461.png)
文字を大きくしました。リンクを選択するとそのリンク先を変更できます。
[](http://images.moongift.jp/2013/09/Screenshot 2013-09-07 14.34.03.1378563465.png)
コードの記述や引用もできます。
PenはWYSIWYGなエディタですが、Markdownを使って記述ができます。なお保存機能は実装されていませんので、Penの編集完了のコールバックを受け取ってデータベースに反映すると言った仕組みは自分で開発する必要があります。
MOONGIFTはこう見る
運用上のサービスに限りませんが、自分が書いたテキストがユーザにどう見えるかを予め確認できる仕組みは大事です。WordPressではプレビュー機能がありますが、実際のところ物足りないケースも多いです。
Markdownエディタの中にはスタイルシートが自分で指定できるものがありますので、それらを使えばより見え方が掴めるようになるでしょう。編集している場所と編集結果が一致すれば、より運用ミスも減るはずです。