【WordPress】子タームだけ出力する方法

WordPressでサイトを作成していてターム一覧を表示する時、表示する場所によっては親子関係にある子タームだけを表示させたいと思うこともあると思います。
今回はそんな時に役立つ、子タームだけ表示させる方法をご紹介します!

基本のタームについて

タームとは

まずタームとは何かというと、WordPressの投稿を分類するために標準で用意された「カテゴリ」や「タグ」とは別にオリジナルで作成することができるものを「カスタム分類(カスタムタクソノミー、通称タクソノミー)」と呼びます。
そして、そのタクソノミーの中の項目のことを「ターム」と呼びます。

タームの表示方法

基本のタームの表示方法はこちらの記事で詳しくご紹介しているため、今回は細かい説明は省略させていただきます。

表示するための記述

<ul>
    <?php
    $terms = get_terms('post_tag'); // タクソノミーの指定
    foreach ($terms as $term) {
        echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>';
    }
    ?>
</ul>

タームの取得方法

よく使われるターム の取得方法は次のようになります。

ターム名$term->name
タームID$term->term_id
タームスラッグ$term->slug
タームの説明$term->description
タームの投稿数$term->count

タームのアーカイブリンクを取得する場合は次のようになります。
単体で記述する場合はtax_slugの部分にはタクソノミーを指定します。
表示方法でご紹介したように別でタクソノミーを指定して呼び出すことも可能です。

//単体で記述する場合
get_term_link($term->slug, "tax_slug"); // タクソノミーの指定

//別の場所で指定して呼び出す場合
$terms = get_terms('tax_slug');  // タクソノミーの指定
foreach ($terms as $term) {
echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>';
}

子タームだけを表示する方法

ではいよいよ本題の子タームだけを表示する方法です。
今回は先ほどタームの表示方法でご紹介した例に追記をしていきたいと思います。

下記のようにif($term->parent)でタームに子タームがあった場合のif分岐を作成します。

<ul>
	<?php
		$terms = get_terms('post_tag'); // タクソノミーの指定
		foreach ( $terms as $term ){
		if($term->parent)
			echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>';
		};
	?>
</ul>

このように指定をすることで子タームだけを表示することができます。
指定する位置を変えることで子タームの場合だけコンテンツを表示させることも可能です!

まとめ

親子のタームを使いこなすことができれば場所によって表示を変えることができるため、表現の幅が広がります!
ぜひご活用ください!

WordPressの関連記事はこちら

この記事をシェアする

関連記事

  • 2022.11.22

    【簡単】CSS でスクロールを促すラインアニメーションを作る方法

    CSS

    HTML5

    コーディング

    制作

  • 2022.11.15

    Wordpressで多言語対応をする方法

    コーディング

    制作

  • 2022.10.24

    超簡単!?たった15分でカウントダウンを作成する方法

    コーディング

    制作

おすすめ記事

  • 2022.04.12

    Chromeで画像やテキストがぼやけるときの対処法

    コーディング

    制作

  • 好きなフォントは?現役WEBデザイナーに聞いてみた!

    2022.06.01

    デザイナーなら好きなフォントの1つや2つあるでしょ?現役WEBデザイナーに好きなフォント聞いてみた!

    デザイン

    制作

  • 2022.05.31

    超簡単!GoogleMapの色をサイトにあわせて変える方法

    コーディング

    制作

×