カテゴリタグをジャンルごとに色変えする

個人サイト覚書の追記その2です。

simple kozinsiteのカテゴリタグの色をカスタマイズしました。

多分他のテーマでも応用できると思います。

カテゴリスラッグを設定する

ダッシュボードからカテゴリを選択します。

クイック編集からスラッグ名を設定します。日本語でなければ何でもいいです。

phpファイルを編集する

変更が必要なファイルは、index.php、category.php、tag.php、archive-novel.php、single.phpです。

要はカテゴリが表示されるページを全部変更します。

直接編集ではなく子テーマに複製するとベターだと思います。

編集するファイルは多いですが、書き換えるのはカテゴリの部分だけなのでそんなに大変ではありません。1ファイル2か所くらいです。

ファイルをテキストエディタで開き、tag__txt の後ろに’.$category->slug.’をつけるだけです。

 <?php
  $categories = get_the_category(); // カテゴリーを取得

 if ($categories) { // カテゴリーが存在する場合
   echo '<ul>';
   foreach ($categories as $category) {
     echo '<li class="tag__txt '.$category->slug.'">';
     echo $category->name; // カテゴリー名のみ出力
     echo '</li>';
    }
    echo '</ul>';
   }
  ?>

これでカテゴリタグにクラス名としてカテゴリのスラッグが付きます。

出力されるコードは以下のようになります。

<li class="tag__txt tkrb">刀剣乱舞</li>

あとは好きなようにCSSで色を付けます。一例はこんな感じ。

.contents .tkrb a {
    border: 1px solid #706caa;
    background: #fff;
    color: #706caa;
}
main .cards__txt .tkrb {
    background: #fff;
    color: #706caa;
    border: 1px solid #706caa;
}

これでカテゴリごとに推しの色になります。ハッピ～！