Etch.js - コンテンツを見たままに編集するWYSIWYGエディタ MOONGIFT
最近のCMSはユーザ画面と管理画面を分けるのではなく、ユーザが見ている画面上で直接コンテンツを編集できるようにしています。その方が実際に反映された時にどのように表示されるのかが分かりやすく、管理画面にログインして修正したいコンテンツを探す必要もありません。 そんなCMSの機能を独自のWebシステムでも実装してみたいと思ったら使ってみて欲しいのがEtch.jsです。 Etch.jsの使い方 こちらが編集画面です。背景色が違う場所が編集できます。 文字をクリックするとツールバーが表示されます。 太字の装飾を消しました。 コンテンツによって使える機能を制限できます。 リストを追加しました。 Etch.jsには保存ボタンがあるので、それを押すとコンテンツをAjaxでサーバに飛ばせるようになっています。実際の保存処理などは作らないといけませんが、インライン編集機能を提供する上で使っていると便利ではな
『高機能でカスタマイズも容易なWYSIWYGエディタ [CKEditor]』
CKEditor は、高機能でありながらもカスタマイズも可能で、ブログの書き込み画面のようなボタンによる編集を容易に実現できるWYSIWYGエディタです。 デモページ も同サイト内に公開されています。 WYSIWYGエディタは、数々公開されていたりしますがあまりにも多機能すぎるとアプリに適用した際に、ユーザーが使いこなせなかったり、複雑すぎるところからサポートが返って面倒になったりもします。 なので、提供される機能からさらに一部を公開したり、アプリの画面要件に沿ってうまく組み込めたり出来るものが無いかを探しているときに見つけました。 しかも日本語に対応してくれていますので、ボタンの説明（alt属性）がちゃんと日本語で表示されます。 また、フォーム要素（テキストボックスやラジオボタン、チェックボックスなど）を埋め込む機能もあるため、カスタマイズ次第ではCMSのアプリを作ることも可能かもしれま
![『高機能でカスタマイズも容易なWYSIWYGエディタ [CKEditor]』](https://cdn-ak-scissors.b.st-hatena.com/image/square/d870572cc1f6bb7afefc46722b77ccf165799944/height=288;version=1;width=512/https%3A%2F%2Fstat.ameba.jp%2Fuser_images%2F20100513%2F00%2Fitboy%2Fe2%2F1d%2Fj%2Fo0705058110538982160.jpg)
テキストエリアを使ってコーディングしやすくする·CodeMirror MOONGIFT
CodeMirrorはJavaScript製のオープンソース・ソフトウェア。Webブラウザのテキストエリアの貧弱さは言うに事欠かない。メモ帳レベルの機能しかなく、とても使い勝手が悪い。HTMLを作成する場合はWYSIWYGなエディタに変換するCKEditorのようなソフトウェアも存在するが、Webブラウザ上でプログラミングしたいと思うような機能はない。 テキストエリアをハイライト もしWeb上で開発者向けのサービスや環境を提供しようと思うならCodeMirrorを使ってみるといいだろう。CodeMirrorはテキストエリアを開発のしやすいエディタ環境に変化させてくれるソフトウェアだ。例えばJavaScript/HTML/CSS/Python/Rubyといった言語向けにハイライト表示する機能がある。 それらは各言語向けのCSSとJavaScriptで作られたパーサーによって作られている。また
MOONGIFT: » XHTMLにも対応したWYSIWYGエディタ「Whizzywig」:オープンソースを毎日紹介
※ 画像は公式サイトデモより。 テキストエリアをHTMLオーサリングツール風にするソフトウェアは各種存在する。有名なものとしてはFCKEditorやSPAW Editor、Xinhaなどがある。 この手のソフトウェアの難点として、HTML構造は汚い事が多かった。XHTML Validなサイトを作っている場合はこれを使ってみる事をお勧めする。 今回紹介するフリーウェアはWhizzywig、Webベースのリッチテキストエディタだ。 Whizzywigは各種文字装飾をボタンを押すだけで簡単にできる。画像挿入（アップロードには未対応）、テーブル組もできる。日本語はまだだが、多言語対応も想定されている。 そして最大の特徴とも言えるのがXHTML Validなソースを作成できる点だろう。イメージタグも<img 〜 />のようになる。また、独自のCSSを認識させる事もできるので、見栄えと照らし合わせなが
MOONGIFT: � シンプルなブラウザ向けWYSIWYGエディタ「widgEditor」:オープンソースを毎日紹介
ブラウザで長文を入力する際には、テキストエリアが利用される。が、これはメモ帳レベル（またはそれ以下）の機能しかなく、非常に使い勝手が悪い。そのため、一度ローカルで文章を作ってからコピー＆ペーストするといった手間が必要になる。 それほど機能は多くないが、分かりやすい。 文字装飾をはじめとした、HTMLタグを手で入力するのは非常に手間ひまがかかる作業だ。そこでテキストエリアを便利に拡張してみよう。 今回紹介するオープンソース・ソフトウェアはwidgEditor、シンプルなWYSIWYGエディタだ。 テキストエリアを拡張するライブラリとしては、FCKEditorなどが有名ではあるが、あまりに多機能であるために重たくなってしまったり、使いこなすのが難しかったりする。その点、widgEditorは限られた機能しかないので使いこなすのはそれほど難しくないだろう。 ソース表示も可能 太字/イタリック/リ
シンプルにリッチなテキストエリア·Sanskrit MOONGIFT
テキストエリアをWYSIWYGエディタに変えるものといえばFCKEditorなどが有名だ。FCKEditorは確かに便利だが、完成度が高すぎるためにカスタマイズしづらく（設定は変更できるが）、何より動作が重たくなっている。 シンプルながらカスタマイズも容易なリッチテキストエディタ 実際にユーザが使う機能はそれほど多くない。もっとシンプルに必要最低限に仕上げたのがSanskritだ。 今回紹介するフリーウェアはSanskrit、テキストエリアをシンプルなWYSIWYGエディタにするソフトウェアだ。ソースコードは公開されているがライセンスは明記されていなかったのでご注意いただきたい。 Sanskritで使える装飾は太字、斜体、下線、打ち消し線、リンクとなっている。これらはTextileの構文に則っており、実際の出力もTextile形式になっている。Sanskritは言わば記法の入力補助とTex
強力にパワーアップした次期FCKEditor·CKEditor MOONGIFT
FCKEditorと言えば、Webベースで使えるWYSIWYGエディタとして有名なソフトウェアだ。しかし既に多数の機能が実装され、コアに手を入れて改造しようとはとても思えない代物になっている。 次期FCKEditor また、多機能ゆえに動作が重たいのが難点だった。そうした問題点を解決できそうなのが次期FCKEditorだ。 今回紹介するオープンソース・ソフトウェアはCKEditor、FCKEditor3.0以降のソフトウェアだ。 FCKEditorは3.0以降から名前が変わり、CKEditorとなる。それに伴って様々な機能拡張がなされている。大きな点として、スキン機能とともに枠の色替え機能が実装されたことだ。なお対応ブラウザはFirefox2以上、IE6以上、Opera9.5以上、Safari3以上となる。 APIによる独自拡張 Ajaxとの親和性も高まっており、ダブルクリックで編集モード
Open Webware | Open Source, Free Cross Browser WYSIWYG
The ultimate WYSIWYG editor for your web-based applications and forms. Finally, a free cross-browser WYSIWYG editor that’s packed with every rich-text editing feature you need to make your content management system that much better. Setting up openWYSIWYG is so easy, you can quickly turn any < textarea > into a powerful WYSIWYG editor with just a few simple lines of code. Packed with every rich te
ヽ( ・∀・)ノくまくまー(2009-04-16) WYSIWYG エディタを徒然と試す
● [jQuery] WYSIWYG エディタを徒然と試す 機能 表組ができる 日本語のIME変換誤動作がない HTMLソース切り替えがinline 画像の挿入ができる (from File, URL) 多段リストができる ブラウザの新規windowを出さない カスタマイズが容易（Obfuscatedではないソースが入手可能） ライセンス という点を中心に徒然と調査する。 CKEditor http://ckeditor.com/ FCKEditor 2.x は 3.x から CKEditor と変名。 Mac + Firefox の場合のみ、IME変換確定で改行が入る不具合あり RETは p, S-RET は br 表組 (popup, propertyで変更可) HTML (inline, スムーズ) 画像 (popup, url, upload) リスト (single) ソース (
HTMLにエンベッドできるWYSIWYGエディタ6選 | CREAMU
HTMLにWYSIWYGエディタを搭載したい。 そんなときにおすすめなのが、『6 Embeddable HTML Editors for Your Website Compared』。Mashableによる、HTMLにエンベッドできるWYSIWYGエディタ6選だ。 以下にご紹介。 » WYMEditor » TinyMCE » Kupu » CB RTE » Xinha » NicEdit 元記事は以下から。 » 6 Embeddable HTML Editors for Your Website Compared HTMLにエンベッドできるWYSIWYGエディタ、チェックして使ってみてはいかがだろうか。 プリンタからインクが出なくてかなりへこみました。。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
シンプルに使えるJS製WYSIWYGエディタ「widgEditor」:phpspot開発日誌
NameBright - Domain Expired