Rails/ckeditor の変更点

• 追加された行はこの色です。
• 削除された行はこの色です。
• Rails/ckeditor へ行く。
• Rails/ckeditor の差分を削除

&tag(Rails/ckeditor);
*目次 [#defcb89f]
#contents
*関連ページ [#lf71e274]
*参考情報 [#xb888c11]
-JavaScriptのリッチテキストエディタckeditorをRailsに組み込めるようにgem化したものがいくつかある。
-[[galetahub/ckeditor:https://github.com/galetahub/ckeditor]]が有名

*インストール方法 [#m7ccec4e]
-Gemfileに追加し、bundle install。
 gem 'ckeditor'
-application.jsを変更。
 //= require ckeditor/init
-ビューで、text_areaをcktext_areaに編集する。

*カスタマイズ [#ccd13d7b]

**ファイルの場所 [#kec995bd]
-以下のファイルを修正する
#pre{{
app/assets/javascripts/ckeditor/config.js
app/assets/javascripts/ckeditor/contents.css
}}

**ツールバーのシンプル化 [#e2b20324]
-config.jsを編集。
#pre{{
CKEDITOR.editorConfig = function (config) {

config.extraPlugins = 'autolink,openlink'
config.toolbar = [
    ['Format','FontSize']
    ,['Bold','Italic','Underline']
    ,['TextColor','BGColor']
    ,['RemoveFormat']
    ,['Link','Unlink','Anchor']
    ,['Source','Maximize','ShowBlocks']
];

}

}}

**スタイルの修正 [#k45a5c19]
-contents.cssを修正(config.jsでの修正は特に必要ないっぽい)。
-例えばpタグのマージンをなくす。
#pre{{
p {
    margin:0;
    padding:0
}

}}

**プラグイン [#y2b44d96]
-config.jsのextraPluginsで指定。複数あるときはカンマ区切り。
    config.extraPlugins = 'autolink,openlink'

***ckeditor-autolink [#i0006983]
-[[Gnodiah/ckeditor-autolink:https://github.com/Gnodiah/ckeditor-autolink]]…自動でリンクするプラグイン。

***open link plugin [#a332207f]
-[[mlewand/ckeditor-plugin-openlink:https://github.com/mlewand/ckeditor-plugin-openlink]]…エディタのリンク部分クリックでリンクをブラウザで表示するプラグイン。
-以下のように修正すると、普通にクリックしただけで開けるようになる。
#pre{{
//					ctrlClickHandlingNeeded = evt.data.$.ctrlKey && !CKEDITOR.env.gecko;
					ctrlClickHandlingNeeded = true
}}


*トラブルシューティング [#t7f09bd5]
**CKEDITOR undefinedと表示される [#o33473ea]
-application.jsで require_tree .があると、プラグイン設定ファイルなどが先に読みこまれてエラーになる模様require_treeを削除すればとりあえずOK。