2024.07.19
ChatGPTにクラス名を付けてもらってみた
- コーディング
ブログやメディアサイトでは、サイト内の回遊率を上げるためにサイドバーやヘッダーなどにカテゴリー一覧が表示されていることが多いです。
サイドバーやヘッダーなどにカテゴリー一覧を表示させたい時、HTMLで静的に書くこともできますが、それではカテゴリーが増えた時にその都度手動で追加することになります。
それが数箇所だったらかなり面倒ですよね…。
WordPressでWebサイトを構築しているなら、管理画面でカテゴリーを追加したら自動的に追加表示させることができます。
「デフォルト(WPコア)のカテゴリー・タグ一覧」と「カスタムタクソノミーのターム一覧」の表示方法をそれぞれご紹介します。
目次
カテゴリー一覧を表示させるには、WordPressで用意されているテンプレートタグである「wp_list_categories」、または「get_categories」を使用します。
2つの違いは、wp_list_categoriesはliタグやリンクなどを自動出力しますが、「get_categories」は自動出力しないという点です。
<ul> <?php $args = array( 'title_li' => '' ); wp_list_categories($args); ?> </ul>
「wp_list_categories」はカテゴリー一覧を取得し、表示まで自動でやってくれます。
パラメータを渡してあげることで、カスタマイズすることができます。
例えば上記コードでは「’title_li’」を空指定することで、自動で出力されるタイトルを非表示にしています。
指定できるパラメータはたくさんあるので、WordPress Codexをご参考ください。
「wp_list_categories」は後述するタグ一覧、カスタムタクソノミーのターム一覧にも使用することができます。
<?php $categories = get_categories(); foreach ($categories as $category) { echo '<li><a href="' . get_category_link($category->term_id) . '">' . $category->name . '</a></li>'; } ?>
「get_categories」はカテゴリー一覧を取得するだけで、そのままでは何も表示されません。
なので、foreach文で取得したカテゴリーを1つ1つ表示させる処理が必要になります。
「wp_list_categories」よりもコードは複雑になりますが、視覚的に自由にタグを入れ込んだりできるため、こちらの方がカスタマイズしやすいと思います。
どちらのテンプレートタグも、カテゴリー一覧を取得するという点では同じ役割のため、使いやすい方を使っていただくか、場面によって使い分けてみてください。
タグ一覧を表示させるには、「wp_list_categories」または「get_tags」を使用します。
<ul> <?php $taglist = wp_list_categories(array( 'taxonomy' => 'post_tag', // タクソノミーの指定 'title_li' => '', )); echo $taglist; ?> </ul>
タグ一覧を「wp_list_categories」で表示させる場合は、パラメータで「post_tag」を指定します。
<ul> <?php $tags = get_tags(); foreach ($tags as $tag) { echo '<li><a href="' . get_tag_link($tag->term_id) . '">' . $tag->name . '</a></li>'; } ?> </ul>
「get_tags」は、「get_categories」と同じようにタグの取得しかしないため、foreach文で繰り返し処理を行い、タグ一覧を表示させます。
カスタムタクソノミーのターム一覧を表示させるには、「wp_list_categories」または「get_terms」を使用します。
<ul> <?php $catlist = wp_list_categories(array( 'taxonomy' => 'news_cat', // タクソノミーの指定 'title_li' => '', )); echo $catlist; ?> </ul>
カスタムタクソノミーのターム一覧を「wp_list_categories」で表示させる場合は、パラメータでカスタムタクソノミースラッグを指定します。
<ul> <?php $terms = get_terms('news_cat'); // タクソノミーの指定 foreach ($terms as $term) { echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>'; } ?> </ul>
引数にカスタムタクソノミースラッグを指定します。
「get_terms」は、「get_categories」と同じようにタームの取得しかしないため、foreach文で繰り返し処理を行い、ターム一覧を表示させます。
実は、「wp_list_categories」と同じく「get_terms」でWPコアのカテゴリー一覧もタグ一覧も表示することができます。
<ul> <?php $terms = get_terms('category'); // タクソノミーの指定 foreach ($terms as $term) { echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>'; } ?> </ul>
タクソノミースラッグを指定する箇所に「category」と入力します。
<ul> <?php $terms = get_terms('post_tag'); // タクソノミーの指定 foreach ($terms as $term) { echo '<li><a href="' . get_term_link($term) . '">' . $term->name . '</a></li>'; } ?> </ul>
タクソノミースラッグを指定する箇所に「post_tag」と入力します。
「get_categories」などとの違いは、引数にタクソノミースラッグを指定することだけです。
「get_categories」は内部で「get_terms」を呼び出しているとのことなので、処理内容はほぼ同じなんですね。
テンプレートタグがごちゃごちゃややこしい!という人は「get_terms」だけ覚えておくと良いでしょう!
今回は「デフォルト(WPコア)のカテゴリー・タグ一覧」と「カスタムタクソノミーのターム一覧」の表示方法をそれぞれご紹介しました。
カテゴリーとタグとカスタムタクソノミー、数多のテンプレートとかなりこんがらがるところなので、それぞれ整理してみました!
用途に合わせてぜひご活用ください。
WordPressの関連記事はこちら
株式会社スピカデザイン
渋谷のWEB制作会社「スピカデザイン」の現役コーダー達が、WEB制作のヒントになるような情報をお届けします。
© 2020 spiqa design