WordPress カテゴリーごとの一覧を「取得」「表示」する

WordPressでカテゴリーごとの一覧を取得して表示したかったので、WordPressのget_categories関数とWP_Queryのサブループを使用してWordPressテーマに表示してみました。

カテゴリーごとの一覧を取得して表示するやり方としては、一覧で取得する「カテゴリータイトル」と「投稿タイトル」を一つに組み合わせてカテゴリーごとの一覧を表示させていくと覚えやすかったです。

1. カテゴリーごとの一覧を取得する
2. カテゴリーごとのタイトル一覧を表示
3. カテゴリーごとの記事一覧を取得
4. カテゴリーごとの投稿件数を変更
5. 親カテゴリーごとの記事一覧を表示

カテゴリーごとの一覧を取得する

はじめにWordPressでカテゴリごとの一覧を取得するために記述した全てのPHPコードを以下に貼り付けておきます。

<div class="cat_list">
    <?php
        $categories = get_categories();
        foreach ($categories as $category):
    ?>
    <h2><a href="<?php echo esc_url(get_category_link($category->term_id)); ?>"><?php echo $category->name; ?></a></h2>
    <?php
        $my_query = new WP_Query(
            array(
                'cat' => $category->term_id,
                'posts_per_page' => 3,
            ));
        if ($my_query->have_posts()):
    ?>
        <ul>
        <?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
        <?php endwhile; ?>
        </ul>
    <?php wp_reset_postdata(); ?>
    <?php else: ?>
        <p>投稿はありません。</p>
    <?php endif; ?>
    <?php endforeach; ?>
</div>

WordPressのget_categories()でカテゴリの呼び出し

カテゴリータイトルをget_category_link関数を使用してリンク付きで取得

取得したカテゴリータイトルをforeachのループで一覧にして表示しています。

取得したそれぞれのカテゴリーに属している投稿タイトルはWordPressのWP_Queryのサブループで投稿タイトルをカテゴリーごとに一覧表示しています。

今回のカテゴリごとの一覧を取得するために記述したPHPコードについては、以下の2つに切り分けると覚えやすいです。

カテゴリーごとのタイトル一覧を表示してるコード部分
カテゴリーごとの投稿タイトルを一覧で取得してるコードの部分

実際に2つのPHPコードに切り分けたのでWordPressにカテゴリーごとの一覧を「取得」「表示」するやり方を理解するヒントになればと思います。

カテゴリーごとのタイトル一覧を表示

WordPressテーマにカテゴリーごとの一覧を表示するPHPコードで、カテゴリータイトルの一覧を取得しているのが以下のコードの部分です。

<div class="cat_list">
    <?php
        $categories = get_categories();
        foreach ($categories as $category):
    ?>
    <h2><a href="<?php echo esc_url(get_category_link($category->term_id)); ?>"><?php echo $category->name; ?></a></h2>
    <!--ここにサブループを記述-->
    <?php endforeach; ?>
</div>

<h2>でマークアップした記述にPHPを組み込んでカテゴリータイトルを表示させます。

カテゴリータイトルに組み込んだPHPはget_categories()から、カテゴリー ID（term_id）とカテゴリー名（name）を取得し、投稿に設定されているカテゴリーをリンク付きで表示しています。出力するリンク先はカテゴリーのアーカイブページです。

そして取得したカテゴリータイトルを一覧で表示しているのはforeach文で繰り返し処理(ループ)をしている記述です。

ループすることでWordPressのカテゴリー設定しているカテゴリーがタイトルごとの一覧で表示できます。

例えばWordPressテーマのindex.phpに上記カテゴリーごとのタイトルだけのPHPコードを記述した一覧表示は以下の画像のように出力されます。

フォントやリンクカラー、レイアウトは、それぞれに使用しているWordPressテーマのCSSのスタイルによって異なります。

カテゴリーごとの記事一覧を取得

WordPressにカテゴリータイトルだけで表示した一覧には、カテゴリごとに属する記事一覧も取得し表示することで「カテゴリごとの一覧」が完成します。

WordPressでカテゴリごとの記事一覧を取得するときはWP_Queryのサブループを以下のように記述して、カテゴリータイトルを一覧形式にしているforeach内で使用します。

<?php
    $my_query = new WP_Query(
        array(
            'cat' => $category->term_id,
            'posts_per_page' => 3,
            ));
        if ($my_query->have_posts()):
?>
    <ul>
        <?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
        <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
        <?php endwhile; ?>
    </ul>
    <?php wp_reset_postdata(); ?>
    <?php else: ?>
        <p>投稿はありません。</p>
    <?php endif; ?>

<?php endforeach; ?>

具体的にはWP_Queryのインスタンスを作成して配列に’cat’ => $category->term_id,の記述でカテゴリーID（term_id）を取得します。この指定がないとカテゴリーごとの記事ではなく、以下の画像のように最新の記事を拾ってループ処理してしまいます。

次に’posts_per_page’ => 3,はカテゴリごとの記事一覧にする投稿の取得件数を3件で表示できるように条件を組んだ記述です。

あとはWP_Queryのサブループを使用するときと同じで、カテゴリーごとの一覧として表示したい内容を記述すると、作成したインスタンスの条件に合う投稿情報があればwhile文のループで繰り返しカテゴリーごとの一覧として表示することができます。

もう一度WordPressでカテゴリごとの一覧を取得するために記述した全てのPHPコードを以下に載せておきます。

<div class="cat_list">
    <?php
        $categories = get_categories();
        foreach ($categories as $category):
    ?>
    <h2><a href="<?php echo esc_url(get_category_link($category->term_id)); ?>"><?php echo $category->name; ?></a></h2>
    <?php
        $my_query = new WP_Query(
            array(
                'cat' => $category->term_id,
                'posts_per_page' => 3,
            ));
        if ($my_query->have_posts()):
    ?>
    <ul>
    <?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
        <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
    <?php endwhile; ?>
    </ul>
    <?php wp_reset_postdata(); ?>
    <?php else: ?>
        <p>投稿はありません。</p>
    <?php endif; ?>
    <?php endforeach; ?>
</div>

カテゴリーごとのタイトル一覧を取得するコード
カテゴリごとの記事一覧を取得するコード

2つのコードを合体させたのが上記の記述です。実際にWordPressテーマのテンプレートに記述すると以下の画像のようにカテゴリーごとの一覧を表示することができます。画像ではCSSで少しデザインしています。

今回のカテゴリーごとの一覧はカテゴリータイトルに属した最新の投稿3件を取得して表示しているだけですが、サムネイルなどが必要な場合にはthe_post_thumbnail()を、抜粋文が必要な場合にはthe_excerpt()をWP_Queryのサブループ内に記述することで、カテゴリーごとの一覧を好きな形式で表示できます。

カテゴリーごとの投稿件数を変更

WP_Queryのサブループでカテゴリーごとの一覧を表示するときに投稿件数を変更することができます。

<?php
    $my_query = new WP_Query(
        array(
            'cat' => $category->term_id,
            'posts_per_page' => 3,
        ));
    if ($my_query->have_posts()):
?>

例えばWP_Queryのインスタンスを作成した配列の記述で’posts_per_page’ => 3,を’posts_per_page’ => 1,に変更するとカテゴリーごとのタイトルに対して、最新の投稿件数が1件で取得でき表示できます。

カテゴリーごとの投稿件数を全件取得して表示したい場合は’posts_per_page’ => -1,に変更します。

親カテゴリーごとの記事一覧を表示

WordPressでカテゴリーごとの一覧を取得するときに第一階層の親カテゴリーだけを取得するようにして、親カテゴリーごとの記事一覧で表示したい場合もあるかと思います。

そんなときには$categories = get_categories()と記述しているget_categories()を配列にして’parent’ => 0,の記述をします。

<div class="cat_list">
    <?php
        $categories = get_categories(
            array(
                'parent' => 0,
        ));
        foreach ($categories as $category):
    ?>
    <h2><a href="<?php echo esc_url(get_category_link($category->term_id)); ?>"><?php echo $category->name; ?></a></h2>

    <?php endforeach; ?>
</div>

WordPressのget_categories()関数はWP Termオブジェクトの配列でカテゴリに関するあらゆる情報を持っています。

例えば’parent’ => 0,で親カテゴリーごとの記事一覧を表示したカテゴリーから、除外したいカテゴリーがあるときには’exclude’ => ‘1’,のようにexcludeに除外したいカテゴリIDを指定してあげることで表示を変更できます。