Movable Typeのエディタープラグイン「CKEditor for Movable Type」で、
ブログ記事とウェブページのエディターCSSを分ける方法をメモしておきます。
ブログ記事とウェブページでテンプレートが違う時などに便利です。
システム → プラグイン設定 → 「CKEditor for Movable Type」の設定タブ、
【その他の設定】の「設定値」に以下を設定します。
// ブログ記事の編集の場合だけ設定を変更する if (CKEditorObjectType == 'entry') { config.contentsCss = ['/css/entry.css']; } // ページの編集の場合だけ設定を変更する if (CKEditorObjectType == 'page') { config.contentsCss = ['/css/page.css']; }
上記は、ブログ記事とウェブページで読み込むスタイルシートを分けた場合です。
ブログ記事とウェブページでブロックが違う場合は、読み込みスタイルシートは共通で、
config.bodyId = ”; 部分をそれぞれ設定するだけで良いかと思います。
(例)
ブログ記事の囲みは「div#entry」、ウェブページの囲みは「div#page」と分けており、
それぞれCSSの設定を「#entry h1」「#page h1」という風に設定している場合
// ブログ記事の編集の場合だけ設定を変更する if (CKEditorObjectType == 'entry') { config.bodyId = 'entry'; } // ページの編集の場合だけ設定を変更する if (CKEditorObjectType == 'page') { config.bodyId = 'page'; }
上はあまりないケースかもですが。。
また、このブログ記事とウェブページで設定を分ける記述方法は、
プラグインの「設定例」に記載されていますが、
「if (CKEditorObjectType = ‘entry’) 」となっており「=」が1つ抜けていて上手くいかず慌てたので、
メモしておきます。
「if (CKEditorObjectType == ‘entry’) 」のように、「==」にすると、正常に反映されます。
コメント