the_categoryによる親子カテゴリーの表示／非表示

カテゴリーページへのリンクを表示する場合、テンプレートタグthe_categoryを使いますが、親子カテゴリーが存在する場合、いくつかの課題が生じることもあります。ここでは、親カテゴリー・子カテゴリーの両方を別々のリンクで表示したり、親カテゴリーのリンクを消す方法などを紹介します。

親カテゴリー・子カテゴリーを別々のリンクで表示したい — 親カテゴリー・子カテゴリーを別々のリンクで表示した場合

この記事の内容

1 the_categoryによるカテゴリーリンクの表示
2 親カテゴリー・子カテゴリーを別のリンクで表示する
3 親カテゴリー・子カテゴリーを1つのリンクで表示する
4 親カテゴリー情報を表示しない
5 親カテゴリーのリンクを消したい（get_the_category）

the_categoryによるカテゴリーリンクの表示

まずは、the_categoryの簡単な使用例を紹介します。single.phpやarchive.phpなどのテンプレートに次のようなコードを入力して、カテゴリーリンクを表示するのが一般的な使い方です。

<?php the_category(); ?>

表示結果の例は次のようになります。

箇条書きで表示したくなければ、the_categoryの第一パラメータでカテゴリーの区切り文字を指定します。以下の例では半角スペースで区切っています。

<?php the_category(' '); ?>

表示結果は次のようになります。

カテゴリーリンクの規則性を利用してCSSを記述すれば、次のように色分けすることもできます。

カテゴリーリンクを色分けする方法について詳しくは以下のページも参考にしてください。

WordPressでカテゴリーを色分けする

ここからは親子カテゴリーに対処するパターンを紹介していきます。

親カテゴリー・子カテゴリーを別のリンクで表示する

イベント情報カテゴリーの子カテゴリーであるスポーツイベントに属する投稿について考えてみましょう。

投稿が実際に属する子カテゴリーのリンクだけでなく、親カテゴリーのリンクも別に表示したい場合は、the_categoryの第二パラメータで「multiple」を指定します。

<?php the_category(' ', 'multiple'); ?>

表示結果は次のようになります。

親カテゴリー・子カテゴリー共にリンクで表示する — 親カテゴリー・子カテゴリーを別々のリンクで表示する

親カテゴリー・子カテゴリーを1つのリンクで表示する

親カテゴリーと子カテゴリーを1つのリンクで表示する場合はthe_categoryの第二パラメータに「single」を指定します。リンクテキストに親カテゴリーと子カテゴリーがまとめられるので第一パラメータを「／」などにしておくと良いかもしれません。

<?php the_category('／', 'single'); ?>

表示結果は次のようになります。

リンク先は、投稿が実際に属する子カテゴリーです。

親カテゴリー情報を表示しない

親カテゴリーの情報を表示しない場合は、この第二パラメータを指定しなければ大丈夫です。

<?php the_category(' '); ?>

表示結果は次のようになります。

親カテゴリーのリンクを消したい（get_the_category）

親カテゴリー・子カテゴリーが共にチェックされている場合、the_categoryでは親カテゴリー・子カテゴリーのリンクが共に表示されます。

子カテゴリーのリンクのみを表示したい場合は、get_the_categoryという命令を使います。the_categoryがカテゴリー情報をそのまま表示するのに対してget_the_categoryでは、いったん取り出したカテゴリー情報を加工して表示できます。

これを利用して、「親カテゴリーを持つカテゴリーのみ」という条件を設定すれば、子カテゴリーのみを表示することができます。以下のコード例の7行目あたりがポイントです。「親カテゴリーのIDが入っている場合は」で絞り込んでいます。

<?php
/* 子カテゴリーのみを表示する */
$categories = get_the_category();
foreach ($categories as $category) {
    $cat_name = $category->name;
    $cat_link = esc_url(get_category_link($category->term_id));
    if ($category->parent) {
        echo sprintf("<a href='%s'>%s</a>", $cat_link, $cat_name);
    }
}
?>

表示結果は次のようになります。親カテゴリー・子カテゴリーがチェックされている投稿でも、子カテゴリーのリンクのみが表示されます。