Toggle

ウェブ

HTMLのtextareaでリッチな テキストエディタを作成できるライブラリ『TinyMCE』がオススメ

こんばんは、ボーノです。

Webサービスでリッチでしかも自由にスタイリングや記述が可能な、テキストエディタを使う必要が出てきた。

ここでは、そんな時に便利なライブラリを紹介。

TinyMCE

リッチなテキストエディタを簡単に生成できる、JavaScriptライブラリ。
下記サイトで無料で公開しています。

特徴としては * 使用までのステップが簡単:ライブラリをダウンロードしてサイトディレクトリに置くだけ * カスタマイズが容易:使用する操作パネルを、JavaScriptで簡単に記述できます * 豊富なパネル:実際に見たら分かります

TinyMCE – Home

Skitch

全機能を盛り込むとこんな感じ。実に豊富な操作パネルですね。まぁ絶対こんなに使わないけど。

NewImage

実際に使ってみると

このコードで

こうなる。

NewImage ## 少し補正 TinyMCEの問題点として、フォームが表示される前に一瞬だけ、HTMLソースが表示されてしまう。 これはとても見栄えが悪い。 下記サイトでその対処法が紹介されていたので、これに習って変更する。 結局は、CSSのスタイルで文字色を背景色と同化して見かけ上見えなくしようというもの。 なんとWordpressとかもこういうアナログ?的な対処法をとってるらしい。

[TinyMCE] テキストエリアに一瞬だけ表示されるHTMLソースを表示させない方法 | CreativeStyle

これで完成!

LEAVE A REPLY

*
*
* (公開されません)

Return Top