Personal tools
You are here: Home Documents How-to KUPU - JavaScriptのWYSIWYGエディタ

KUPU - JavaScriptのWYSIWYGエディタ

Document Actions
KUPUはJavaScriptのWYSIWYGエディタ「epoz」から発展した「epozNG」が、新たに「Kupu」という名前になり、 OSCOM(オープンソースCMSの国際NPO)のオフィシャル・プロジェクトになりました。 もともとはZope用に作られたものですが、クライアントサイド(JavaScript)で動くので、Zope以外でも使えます。

入手先

デフォルトで Plone 2.1 に入っています

インストール方法

デフォルトで Plone 2.1 に入っています。 最新版は plone.org からダウンロードしてください。

必要システム条件

  • Zope 2.7 and Python 2.3.3以上
  • Plone 2.0以上
  • CMF 1.4以上

最新の開発中のバージョンのKupuをSVNからインストールしたい場合は下記のものが必要です。

  • Gnomeに付属のxsltproc−libxml/libxsltといったXIncludeのXSLTプロセッサが必要です。

リリースバージョンのkupuを使用する場合は必要ありません。

インストール

ZOPEインスタンスのProductsディレクトリの中へ解凍したkupuディレクトリを入れます。 ※各プラットホーム専用のPlone圧縮ファイルからインストールしている場合は、以下の作業は必要ありません。「Zopeインスタンスの再起動」で始まる段落まで進みます。

SVNから開発板をインストールする場合は、以下をタイプしてPlone templateを生成します。

$ make plonemacros

外部エントリをロードできないという、xsltproc throwエラーが発生しても無視してください。

Windowsユーザーはまず最初に、http://www.zlatkovic.com/pub/libxml/からxsltproc.exeをダウンロードします。最低限、libxslt, libxml2, iconv, zlibのzipファイルをダウンロードする必要があります。解凍したすべての「.dll」「.exe」ファイルを「c:libxslt」へ移動し、コマンドを使えるようにします(zipファイルのサブディレクトリは無視します)。その後、kupuのディレクトリ内でコマンドプロンプトを開き、同じコマンドを実行します(Windows環境では、make.batを実行するだけで個々のプログラムを作る必要はありません)。

C:\>cd \Plone 2\Data\Products\kupu

C:\Plone 2\Data\Products\kupu>make plonemacros

Zopeインスタンスを再起動します。

Ploneのコントロールパネルを開き、「プロダクツの追加と削除」からkupuを選択してインストールします。

通常、各ユーザーは明示的に「個人別設定」おいて「コンテンツエディタ」に「kupu」を選択しておく必要があります。またKupuや最近のバージョンの Epozは同じPloneにインストールしておくことができます。これなら各ユーザーは自分で好きな方を選択することもできます。管理者は以下の操作で ZMI上で、新規ユーザーのデフォルトエディタをKupuに設定することも可能です。:

"portal_memberdata" -> "Properties" -> "wysiwyg_editor" = "Kupu"

アップグレード

kupuをバージョンアップする場合、Ploneのデフォルト設定が変更されてしまうことに注意してください。

デフォルト設定から何も変更していなければ、kupu-plone skinフォルダの中の'sample-kupu-customisation-policy'スクリプトを実行します。これにより。全てのコンフィグレイションのオプションがデフォルトにリセットされます。

設定を独自にカスタマイズしている場合は、'kupu-customisation-policy'を参考にしてスクリプトを作成してください。ほとんどの場合、スクリプトの先頭のデータ宣言の箇所にのみ変更が必要です。

Epozからのマイグレーション

EpozとKupuは併用することが出来ます。単に両方のプロダクトをインストールするだけです。 古いバージョンのEpozを使用している場合には、より最新のバージョンにアップグレードして下さい。または、KupuのスキンフォルダがEpozよりも先に検索されることを確認しておいて下さい。 それから全ての利用者に自分のユーザープリファレンスからKupuをデフォルトエディタに選択することを推奨して下さい。

利用可能なブラウザ

Firefox

Internet Explorer

今のところ、OperaとSafariでは動作しません。

使い方

使い方はWord等と同じです。入力してアイコンをクリックして適用します。

kupu-icon/image_preview

一番左のプルダウンメニューからは本文、heading、subheading、枠で囲むが選択出来ます。

デフォルトのアイコンは左から「ボールド」「イタリック」「アンダーライン」「下付き」「上付き」「左揃え」「センター揃え」「右揃え」「数字箇条書き」「箇条書き」「定義リスト」「アウトデント」「インデント」「画像」「サイト内リンク」「インターネットリンク」「表」「取り消し」「繰り返し」「HTMLコード編集」。右の二つは「ズーム」と「http://kupu.oscom.org/へのリンク」です。なお、リンクがあると「表」と「取り消し」の間に「リンクを削除」のアイコンが表示されます。

kupu-ol/image_preview

数字箇条書きは箇条書きにするともう一つプルダウンメニューが出て数字の種類を選択出来ます。デフォルトはアラビア数字1から順です。他に「大文字ローマ数字」「小文字ローマ数字」「大文字アルファベット」「小文字アルファベット」が選択出来ます。 箇条書きもプルダウンメニューが表示されます。デフォルトは■です。他に「●」「○」「点なし」が選択可能です。

プルダウンメニューは箇条書きのところにカーソルがある場合にのみ表示されます。

なお、通常の改行では<br>タグが入るので、単純に改行して何行か書いて箇条書きを選択しても箇条書きになりません。returnを2回押すことで<p>タグが入るので箇条書きになります。htmlコードが汚いのが気になる方はコード編集で整えましょう。

また、「画像」ボタンでは画像をアップロードして貼付けることが出来ます。jpegかgifにしてタイトルをつけてアップロードします。

upload/image_preview
The following items are included in this how-to:
Image kupuのアイコン
kupuでデフォルトで表示されるアイコンです。
The following items are included in this how-to:
Image リストタグ
リストタグolでの選択プルダウンメニュー
The following items are included in this how-to:
Image 画像アップロード
kupuでの画像アップロード画面。

This How-to applies to: Plone 2.1.x

by tacaco last modified 2006-05-02 23:51

Powered by Plone, the Open Source Content Management System