【WordPress】親カテゴリと子カテゴリをリンク付きで表示する

投稿日 2020年10月12日
著者のせっち
カテゴリー WordPress

こんにちは！フリーランスWebディレクター兼エンジニアののせっち@nosecchi01です。

ワードプレスで、親カテゴリ、子カテゴリをそれぞれリンク付きで表示する方法です。

自分自身が調べていて、下記の問題にぶつかりました。

コピペで簡単に実装できると思いきや、リンクが出ない(unknownになる)。
親カテゴリ、子カテゴリそれぞれにクラスを当てたいのに、一緒くたに出てしまう。

上記問題を解決しつつ、コピペで実装できるように纏めました。
→同じ悩みを持っている方は参考にしてください。

それでは早速行ってみましょう。

親カテゴリをリンク付きで表示する。

<?php
  $categories = get_the_category();  // カテゴリ情報を配列で取得
  foreach( $categories as $category ) :
    $parent = $category->parent; // 親カテゴリーIDを取得
    if( !$parent ){
      echo '<a class="c-meta__cat c-meta__cat--main" href="' . get_category_link( $category->term_id ) . '">' . $category->name . '</a>';
      break;
    }
  endforeach;
?>

ループの中で使う必要がある点に注意してください。

子カテゴリをリンク付きで表示する。

<?php 
  $categories = get_the_category();  // カテゴリ情報を配列で取得
  foreach( $categories as $category ):
    $parent = $category->parent; // 親カテゴリーIDを取得
  if( $parent ) {
    echo '<a class="c-meta__cat c-meta__cat--sub" href="' . get_category_link( $category->term_id ) . '">' . $category->cat_name. '</a>';
  }
  endforeach;
?>

ループの中で使う必要がある点に注意してください。