wordpressでページごとに違うCSSやjavascriptを適用

wordpressを利用していて、このページだけ別のCSSを適用したい、またはjavascriptを追加したいということはありませんか?
例えば先日の「CSSのみで滑らかなアコーディオンを実現」などのように、サンプルを紹介するページのみにcssを適用したいなんてことがあります。
 
またwordpressにはたくさんの良質なテンプレートがありますが、デザイナー(クリエイター)によってはそのテンプレートを頻繁にアップデートしてくれたりします。
細かい修正と言うものが主なところでしょうが、テンプレートを直接修正して何かをやっていると、その都度同じような修正が必要だったりしますよね。更に僕のように思いつくままにいろいろやっていると、何を加筆したか覚えていないなんてことも(笑)
細かい修正にはいろいろありますけど、この好きな記事(固定ページを含む)に好きなCSSやjavascriptを直接、もしくはファイルのリンクとしてヘッダー内に埋め込んでくれるプラグインがあります。

プラグインをダウンロード、解凍後、wordpressのプラグインフォルダーに突っ込みます(プラグインディレクトリーにアップロードします)。
その後、プラグインメニューから有効化してあげれば準備完了です。

cssやjavascriptを追加したい記事の編集時に、カスタムフィールドとして必要な情報を追加します。
追加の仕方は4つ。
cssを直接記入
css外部ファイルのリンク(URL)を記入
javascriptを直接記入
javascript外部ファイルのリンク(URL)を記入
それぞれ、カスタムフィールドの名前を「css」「cssfile」「js」「jsfile」として、その内容を値として入力します。

外部ファイルのリンクの時には、パスを間違えないように気をつけなくてはいけません。
相対パスで入力した場合に、wordpress本体がサブディレクトリ(下の階層)にインストールされている場合など、気をつけないとうまくリンクされないからです。
最も安全なのは絶対パスで入力することと、外部ファイルとして適用するものはテーマファイルのディレクトリに入れないことです。
またこれらが挿入されるのはheadタグ内の最後の方になります。
それから最近気づいたのですが、どうやらトップページで記事一覧を表示している場合、その記事に埋め込んだコードがトップページにも埋め込まれてしまっているようです。これはコードによっては致命的なので気をつけなくてはいけませんね。

まずはじめに、カスタムフィールドって使う必要あるの?と思っていたせいもあり、カスタムフィールドん存在すら忘れていました。
そして今回のプラグインの適用にあたって、カスタムフィールドってどうやって入力するの??なんていうものすごく初歩的な部分でつまづきました(笑)
以前は最初から表示されていたと思っていたのですが、今はデフォルトでは非表示になったようですね。
記事編集画面(投稿画面)の右上にある「表示オプション」をクリックして、「カスタムフィールド」の表示にチェックを入れましょう。
表示オプション

カスタムフィールド

外部cssfileを設定しています

ダウンロードは以下のページから可能です。
とりさんのソフト屋さん|cssやJavaScriptをヘッダに追加するプラグイン(WordPress)
実は・・・色々サンプルを置いたらそれをすべて全ページで読み込むと大変だなぁと思っていたので、自分で何か作るか、テンプレートを書き換えるかーって思っていたところに良いものを見つけたので、さっそく利用させていただいております。