@@ -28,10 +28,9 @@
config.extraPlugins = 'rewrite';
// rewrite の機能を有効にします。
config.rewrite_urls = true;
- // 追加の設定をしない場合は「a」の「href」と「img」の「src」を
- // ホストからの相対パスに書き換えます。
+ // デフォルトではホストからの相対パスに書き換えます。
}
}}}
]]>
@@ -47,17 +47,17 @@
config.rewrite_rules = {
a: {
href: {
// http://example.com/のファイルを相対パスへ書き換え
- from: 'http://example.com/,
+ from: 'http://example.com/',
to: ''
}
},
img: {
src: {
// http://foo.example.com/を
// http://bar.example.com/へ書き換え
- from: 'http://foo.example.com/,
+ from: 'http://foo.example.com/',
to: 'http://bar.example.com/'
}
}
};
]]>
@@ -62,4 +62,21 @@
}
};
}
}}}
+
+== ckeditor/config.js の設定例 (まとめて指定する) ==
+
+{{{
+CKEDITOR.editorConfig = function(config) {
+ config.extraPlugins = 'rewrite';
+
+ // rewrite の機能を有効にします。
+ config.rewrite_urls = true;
+
+ // 書換え元のURLを指定します
+ config.rewrite_default_from = 'https?://foo.example.com/(img|css)';
+ // 書換え先のURLを指定します
+ config.rewrite_default_to = 'http://bar.example.com/$1';
+}
+}}}
+
]]>
@@ -13,9 +13,9 @@ ダウンロードしたファイルを展開して「ckeditor/plugins/rewrite」をインストール先の「ckeditor/plugins/」の下へ設置してください。 === 読み込むプラグインの追加 === -ckeditor/config.js で config.extraPlugins へ rewrite を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/Rewrite%22#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B.20.28.E3.83.87.E3.83.95.E3.82.A9.E3.83.AB.E3.83.88.E3.81.AE.E5.80.A4.E3.82.92.E4.BD.BF.E3.81.86.29 設定例]) ([http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins ドキュメント]) +ckeditor/config.js で config.extraPlugins へ rewrite を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/Rewrite#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B.20.28.E3.83.87.E3.83.95.E3.82.A9.E3.83.AB.E3.83.88.E3.81.AE.E5.80.A4.E3.82.92.E4.BD.BF.E3.81.86.29 設定例]) ([http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins ドキュメント]) === ツールバーへのボタンの追加 === ckeditor/config.js で変換のルールを指定します。]]>
@@ -1 +1,65 @@
+= Rewrite =
+「a」や「img」のリンク先のURLを書き換えるプラグインです。
+
+== インストール手順 ==
+
+=== ダウンロード ===
+
+[http://sourceforge.jp/projects/ckeditor/releases/?package_id=10267 ダウンロードページ]からプラグインをダウンロードします。「src.zip」と「src.tar.gz」は開発者向けのファイルなので、プラグインを利用する場合は「src」の付かないファイルをダウンロードしてください。
+
+=== ファイルの設置 ===
+
+ダウンロードしたファイルを展開して「ckeditor/plugins/rewrite」をインストール先の「ckeditor/plugins/」の下へ設置してください。
+
+=== 読み込むプラグインの追加 ===
+
+ckeditor/config.js で config.extraPlugins へ rewrite を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/Rewrite%22#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B.20.28.E3.83.87.E3.83.95.E3.82.A9.E3.83.AB.E3.83.88.E3.81.AE.E5.80.A4.E3.82.92.E4.BD.BF.E3.81.86.29 設定例]) ([http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins ドキュメント])
+
+=== ツールバーへのボタンの追加 ===
+
+ckeditor/config.js で変換のルールを指定します。
+
+
+== ckeditor/config.js の設定例 (デフォルトの値を使う) ==
+
+{{{
+CKEDITOR.editorConfig = function(config) {
+ config.extraPlugins = 'rewrite';
+
+ // rewrite の機能を有効にします。
+ config.rewrite_urls = true;
+ // 追加の設定をしない場合は「a」の「href」と「img」の「src」を
+ // ホストからの相対パスに書き換えます。
+}
+}}}
+
+
+== ckeditor/config.js の設定例 (細かく指定する) ==
+
+{{{
+CKEDITOR.editorConfig = function(config) {
+ config.extraPlugins = 'rewrite';
+
+ // rewrite の機能を有効にします。
+ config.rewrite_urls = true;
+
+ config.rewrite_rules = {
+ a: {
+ href: {
+ // http://example.com/のファイルを相対パスへ書き換え
+ from: 'http://example.com/,
+ to: ''
+ }
+ },
+ img: {
+ src: {
+ // http://foo.example.com/を
+ // http://bar.example.com/へ書き換え
+ from: 'http://foo.example.com/,
+ to: 'http://bar.example.com/'
+ }
+ }
+ };
+}
+}}}
]]>
@@ -1,3 +1,53 @@
= 文字装飾ボタンのカスタマイズ (開発者向けの情報) =
+[[Embed(http://sourceforge.jp/projects/ckeditor/wiki/BasicStyles/attach/8b561214905e75d0428e131e8f0b7830.png)]][[BR]]
+文字装飾のボタンを押した際に、装飾として使われる要素を変更する方法を説明します。
+
+== 要素の変更 ==
+これらのボタンが登録されているのは「basicstyles」というプラグインです。
+
+そこで「_source/plugins/basicstyles/plugin.js」の下部を見てみると、
+以下のような設定があるので、これを config.js などで変更すると要素を変更できることが分かります。
+
+{{{
+// Basic Inline Styles.
+CKEDITOR.config.coreStyles_bold = { element : 'strong', overrides : 'b' };
+CKEDITOR.config.coreStyles_italic = { element : 'em', overrides : 'i' };
+CKEDITOR.config.coreStyles_underline = { element : 'u' };
+CKEDITOR.config.coreStyles_strike = { element : 'strike' };
+CKEDITOR.config.coreStyles_subscript = { element : 'sub' };
+CKEDITOR.config.coreStyles_superscript = { element : 'sup' };
+}}}
+
+
+== 問題へのの対応 ==
+前項の変更で設定を変更することはできるのですが、一つ落とし穴があって、
+例えば「uではなくins」「strikeではなくdel」のような以下の設定をした場合、
+
+{{{
+CKEDITOR.config.coreStyles_underline = { element : 'ins' };
+CKEDITOR.config.coreStyles_strike = { element : 'del' };
+}}}
+
+パラグラフ全(P要素)体を選択して「下線」ボタンを押したときに、装飾の結果が以下のようになってしまい、
+正しいHTMLとなりません。
+{{{
+文章
+}}}
+
+CKEditorでは文字の修飾をするときに、
+「CKEDITOR.dtd (_source/core/dtd.jsで定義)」を見ているのですが、
+「ins」や「del」への装飾の際にこれがうまく働かないことが原因のようです。
+
+この問題については本当は「dtd.js」を追わなくてはいけないとは思うのですが、、
+簡単な解決方法としては、CKEDITOR.dtd の「u」や「strike」からコピーするというものがあります。
+
+{{{
+CKEDITOR.dtd.del = CKEDITOR.dtd.strike;
+CKEDITOR.dtd.ins = CKEDITOR.dtd.u;
+CKEDITOR.config.coreStyles_underline = { element : 'ins' };
+CKEDITOR.config.coreStyles_strike = { element : 'del' };
+}}}
+
+こうすることで正しく「ins」や「del」で装飾されます。
]]>
@@ -1 +1,3 @@ += 文字装飾ボタンのカスタマイズ (開発者向けの情報) = +]]>
@@ -1 +1,4 @@ += CKEditor JapanのWiki = + +[[TitleIndex]]]]>
@@ -18,10 +18,8 @@ === 読み込むプラグインの追加 === ckeditor/config.js で config.extraPlugins へ mobilepictogram を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) ([http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins ドキュメント]) - -プラグインの追加はCKEditorのドキュメントが参考になります。 === ツールバーへのボタンの追加 === ckeditor/config.js で config.toolbar へ MobilePictogram を追加してください。 ([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) ([http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar ドキュメント])]]>
@@ -17,13 +17,15 @@ ダウンロードしたファイルを展開して「ckeditor/plugins/mobilepictogram」をインストール先の「ckeditor/plugins」の下へ設置してください。 === 読み込むプラグインの追加 === -ckeditor/config.js で config.[http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins extraPlugins] へ mobilepictogram を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) +ckeditor/config.js で config.extraPlugins へ mobilepictogram を追加してください。([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) ([http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.extraPlugins ドキュメント]) -=== ボタンの追加 === +プラグインの追加はCKEditorのドキュメントが参考になります。 -ckeditor/config.js で config.[http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar toolbar] へ MobilePictogram を追加してください。 ([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) +=== ツールバーへのボタンの追加 === + +ckeditor/config.js で config.toolbar へ MobilePictogram を追加してください。 ([http://sourceforge.jp/projects/ckeditor/wiki/MobilePictogram#h2-ckeditor.2Fconfig.js.20.E3.81.AE.E8.A8.AD.E5.AE.9A.E4.BE.8B 設定例]) ([http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar ドキュメント]) == ckeditor/config.js の設定例 ==]]>