世界中の１％の人々へ

■CKEditor 日本語ローカライズ版開発コンセプト

CKEditorは基本的には、"ckeditor/ckeditor.js"を編集することで、カスタマイズが行えるのだが、"ckeditor.js"は開いてみるとわかるが、1行のやたら長い約109行のJavaScriptファイルで、これをバージョンアップの都度修正するのは大変なので、三人で協議して開発コンセプトを定めた。

• 特定のCMSに依存しないで利用できるものであること
• ”ckeditor.js”を触らないこと
• ソースは視認性に優れ、組込や、修正、カスタマイズがわかりやすいこと

開発コンセプトに基づき、今回のローカライズ用ファイルは、"ckeditor/ckeditor.js"の末尾に下記ソースを追記する方法をとった。

◇カスタマイズ用ソース

CKEDITOR.config.fontSize_sizes='80%/80%;90%/90%;100%/100%;110%/110%;120%/120%;130%/130%;140%/140%;150%/150%;160%/160%;170%/170%;180%/180%;190%/190%;200%/200%';
CKEDITOR.config.font_names='MSゴシック/MS Gothic, Osaka-Mono, monospace; MS Pゴシック/MS PGothic, Osaka, sans-serif; MS UI Gothic/MS UI Gothic, Meiryo, Meiryo UI, Osaka, sans-serif; MS P明朝/MS PMincho, Saimincho, serif; Arial/Arial, Helvetica, sans-serif;Comic Sans MS/Comic Sans MS, cursive;Courier New/Courier New, Courier, monospace;Georgia/Georgia, serif;Lucida Sans Unicode/Lucida Sans Unicode, Lucida Grande, sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/Times New Roman, Times, serif;Trebuchet MS/Trebuchet MS, Helvetica, sans-serif;Verdana/Verdana, Geneva, sans-serif';
CKEDITOR.dtd.del = CKEDITOR.dtd.strike;
CKEDITOR.dtd.ins = CKEDITOR.dtd.u;
CKEDITOR.config.coreStyles_underline = { element : 'ins' };
CKEDITOR.config.coreStyles_strike = { element : 'del' };

◇カスタマイズ箇所

下記3点

1. 日本語書体の追加
2. フォントサイズ指定を絶対値から相対値へ変更
3. 非推奨タグを推奨タグに置換

以上。

1. 日本語書体の追加

下記の4書体を追加した。

• MS ゴシック / MS Gothic, Osaka-Mono, monospace
• MS Pゴシック / MS PGothic, Osaka, sans-serif
• MS UI Gothic / MS UI Gothic, Meiryo, Meiryo UI, Osaka, sans-serif
• MS P明朝 / MS PMincho, Saimincho, serif

◇出力ソース

<p>
    <span style="font-family: ms gothic,osaka-mono,monospace;">あさがお　MSゴシック</span></p>
<p>
    <span style="font-family: ms pgothic,osaka,sans-serif;">あさがお　MS Pゴシック</span></p>
<p>
    <span style="font-family: ms ui gothic,meiryo,meiryo ui,osaka,sans-serif;">あさがお　MS UI Gothic</span></p>
<p>
    <span style="font-family: ms pmincho,saimincho,serif;">あさがお　MS P明朝</span></p>

2. フォントサイズ指定を固定値(px)から相対値(%)へ変更

初期仕様では、フォントサイズ指定にはpxが使われていたが、フォントサイズの固定はアクセシビリティ上好ましく、相対値へと変更した。値は直感的に理解でき、かつ正確な数値が計算できる方法として「%」を選んだ。

◇出力ソース

<p>
    <span style="font-size: 80%;">Web標準の日々　80%</span><br />
    <span style="font-size: 90%;">Web標準の日々　90%</span><br />
    <span style="font-size: 100%;">Web標準の日々　100%</span><br />
    <span style="font-size: 110%;">Web標準の日々　110%</span><br />
    <span style="font-size: 120%;">Web標準の日々　120%</span><br />
    <span style="font-size: 130%;">Web標準の日々　130%</span><br />
    <span style="font-size: 140%;">Web標準の日々　140%</span><br />
    <span style="font-size: 150%;">Web標準の日々　150%</span><br />
    <span style="font-size: 160%;">Web標準の日々　160%</span><br />
    <span style="font-size: 170%;">Web標準の日々　170%</span><br />
    <span style="font-size: 180%;">Web標準の日々　180%</span><br />
    <span style="font-size: 190%;">Web標準の日々　190%</span><br />
    <span style="font-size: 200%;">Web標準の日々　200%</span>
</p>

3. 非推奨タグを推奨タグに変換

非推奨タグである、"u"、"strike"が使われているので、"ins"、"del"が入力できるように修正した。

• "strike" → "del"
• "u" → "ins"

◇出力ソース

<p>
	太字　<strong>Movable Type 5.0 RC1</strong></p>
<p>
	斜体　<em>Movable Type 5.0 RC1</em></p>
<p>
	アンダーライン　<ins>Movable Type 5.0 RC1</ins></p>
<p>
	打ち消し　<del>Movable Type 5.0 RC1</del></p>

■使い方

オリジナルの"ckeditor.js"を修正していなければの話だけど、解凍したできたフォルダー内の"ckeditor.js"をCKEditor3.0.1の"ckeditor/ckeditor.js"と入れ替えてください。それだけです。

利用者各自の責任においてお使いください:-)

緊急予告！

2009年11月9日(月)　CKEditor for Movable Type 1.00がToI企画よりリリース！
乞うご期待。