WordPressの特定カテゴリーごとに別のスタイルシート(CSS)を適応する方法

WordPressの基本

WordPressではスタイルシートはそれぞれのテーマの「style.css」に書けば、記事生成時に自動で読みこまれますが、時にはカテゴリーごとに適応するスタイルを変更したい場合があります。

そんな時に簡単にWordpressの特定カテゴリーごとに別のスタイルシート(CSS)を適応する方法をまとめてみました。

特定カテゴリーにスタイルシート(CSS)を適応する

ググれば多くの方法が出てきますが、個人的にはそれぞれのカテゴリーごとにスタイルシートを作成して動的に読み分ける方法が、簡単で分かりやすいかと思います。

読み込むスタイルシートを動的に変更する

カテゴリーごとにスタイルシートを読み替えるには以下のコードをfunction.phpに追加します。

add_action('wp_head','my_laod_css');
function my_laod_css()
{
    if( in_category( '読み込みたいカテゴリースラッグ' )){
        echo '<link rel="stylesheet" href="{読み込みたいスタイルシート(CSS)ファイルのURL}">';
    }
}

とカテゴリーのスラッグで読み分けします。

こうすることで「header」タグを生成するタイミングで記事のカテゴリーごとに読み込みたいスタイルシート(CSS)を選択することができます。

このように作成するスタイルシートはWordPressのテーマ配下に置くのではなく、サイトの普遍的なディレクトリに配置しておく方が良いと思います。

テーマを変更しても影響は受けにくいので、こちらの方がトラブルは少ないです。

注意
function.phpを修正する際は必ずバックアップを取ってから作業するようにしてください。
安全に「function.php」にコードを追加するには「Code Snippets」プラグインが便利です。
WordPressプラグインfunction.phpを編集なしでコード追加するCode Snippetsの使い方

まとめ

WordPressではカテゴリーごとに読み込むスタイルシート(CSS)を切り替えることで、それぞれの見栄えを動的に変化させることができます。

以上、「Wordpressの特定カテゴリーごとに別のスタイルシート(CSS)を適応する方法」でした。