wordpressで記事ごとにcssを指定できるプラグイン「Custom CSS and JS」

年明けはやっぱり案件が混んできて忙しいですね。
ブログの日にちがあいてしまった自分への言い訳をしながら
はじめます。（笑）

今回はwordpressで記事ごとに
cssを指定できるプラグイン「Custom CSS and JS」をご紹介します。

以下の「共通設定」をしたあと、順番に

と、説明していきます。
共通設定は、どちらの方法をする場合でも必要です。

Custom CSS and JSをインストール

まず、ダッシュボードのプラグインから新規追加を選択し
「Custom CSS and JS」で検索します。

「今すぐインストール」をクリックでインストールが始まりますので
終わったら「有効化」にして完了です。

共通設定

Custom CSS and JSはカスタムフィールドを使用します。

投稿画面（固定ページでもOK）を開いて、「表示オプション」を選択。
「表示する項目」の「カスタムフィールド」にチェックを入れましょう。

これで「カスタムフィールド」が表示されます。

個別のcssファイルを読み込む

カスタムフィールドの「新規追加」をクリック。

そうすると名前と値を入力できるようになるので、
名前： custom_css
値： /xxx.css ※cssファイルを設置する場所とcssファイルの名前を入力します

入力したら、「カスタムフィールドを追加」をクリックで
cssを読み込むためのカスタムフィールドができました。

記事のソースには
[code]
<link rel="stylesheet" type="text/css" href="/xxx.css" />
[/code]
と「xxx.css」を読み込むようになりますので、指定したcssファイルにcssを記述すれば
スタイルが適用されます。

個別にcssを直接適用させる

ひとつの投稿や固定ページにのみcssを反映させたい場合もありますよね。
この場合は、cssを読み込ませてわざわざcssファイルを作成して…というのは
ちょっと面倒ですよね。。

なので、ここでは直接cssを適用させる方法をご説明します。

カスタムフィールドの「新規追加」をクリック。
名前：　custom_css_code
値：　ここにcssを直接記述していってOKです

JSを指定したい場合

上記で説明してきた、cssファイルを読み込む方法・直接cssを記述する方法と同じように
名前・値に入力すればOK。

	名前	値
jsファイルを読み込む	custom_js	ファイルまでのパスを入力
jsを直接入力	custom_js_code	値にJavaScriptを直接入力

最後に

とっても便利なプラグインですが、アップデートが止まっているようです…
自己責任でご利用ください。

ちなみにこのブログはwordpress4.4.1なので、このバージョンまではひとまずOKかなと思います。