WordPressのメインループとサブループの使い方

2023年6月30日

目次
  • 1. WordPressのメインループとサブループとは？
  • 2. メインループの使い方
  • 3. サブループの使い方
  • 4. メインループの条件を変更する「pre_get_post」
  • 5. 参考

WordPressのメインループとサブループとは？

WordPressでは投稿や固定ページなどのURLにアクセスすると、そのURLにふさわしい内容のコンテンツが表示されるようになっています。たとえば「会社概要」の固定ページにアクセスすると「会社概要」の固定ページのコンテンツがブラウザに表示されるという具合です。

これは当たり前の動作のように思えますが、この仕組みを実現しているのがWordPressのメインループです。
メインループとは、アクセスされたURLに応じて、それ以外の条件指定なしでコンテンツを表示させる仕組みのことをいいます。

一方、アクセスされたURLに対して、一定の条件を与えて表示させるコンテンツをカスタマイズさせる仕組みのことをサブループと呼びます。

たとえば「リンゴ」というカテゴリーページにアクセスすると、通常は「リンゴ」カテゴリーに設定されている投稿の一覧が表示されます。

この「リンゴ」カテゴリーページ上で「オレンジ」カテゴリーに所属している投稿の一覧を表示させたい場合、「オレンジカテゴリーに所属している」という条件を与えてサブループを記述します。

このサブループを使いこなすことで、WordPressのカスタマイズの幅はグッと広がります。それでは、メインループとサブループの使い方について詳しく見ていきましょう。

メインループの使い方

メインループのコードの例を紹介します。

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    <a href="<?php the_permalink() ?>"><?php the_title(); ?></a>

<?php endwhile; endif; ?>

PHPのプログラミングに慣れた人でも、このコードを一目で理解するのは難しいかもしれません。１行目の具体的な意味は以下の通りです。

  • 「if (have_posts())」…記事が存在しているかどうか
  • 「while (have_posts())」…記事がある場合は繰り返す
  • 「the_post()」…次の記事の情報を取得する

以上の３つの要素からメインループは構成されています。
最初の記事から最後の記事まで、記事を取得するごとにループカウンターを増加させていき、最後の記事の取得が完了したらループを抜ける、というような処理をイメージするとよいでしょう。

このループの中に各種テンプレートタグを記述することで、ブラウザ上に表示させる要素をコントロールすることになります。上記のサンプルでは、パーマリンクが設定されたページのタイトルのリストが表示されます。

WordPressで使用できるテンプレートタグは、WordPress Codexで詳しく解説されています。投稿や固定ページの公開日時、パーマリンク、所属しているカテゴリーやタグなど、さまざまな情報が取得できます。

サブループの使い方

サブループは、「一定の条件を与える」というコードが追加されたメインループをイメージするとよいでしょう。具体的には以下の通りです。

<?php
    // サブループに条件を与える　
    $my_query = new WP_Query(); 
    $args = array(
        'post_type' => 'info',
    );
    $the_query->query( $args ); 
?>

<?php if( $the_query->have_posts() ): while( $the_query->have_posts() ) : $the_query->the_post();?>

    <a href="<?php the_permalink() ?>"><?php the_title(); ?></a>

<?php endwhile; endif; wp_reset_postdata(); ?>

上記サンプルでは、カスタム投稿タイプ「info」をサブループの条件としています。つまりこのコードを実行すると、「info」タイプの投稿のリストが表示されることとなります。

具体的に条件を指定している部分が「$args = array(」で始まる配列の部分です。この配列にサブループの条件を追加していくことで、複雑な条件のサブループの構築も可能となります。サブループを記述した際は、最後に「wp_reset_postdata();」を記述するのを忘れないようにしましょう。この記述はサブループを終了させるという意味を持ちます。

配列に追加できるパラメータの詳細は、WordPress Codexの「関数リファレンス/WP Query」で詳しく解説されています。実務で活用できそうなサンプルが多数掲載されているので、確認しておくとよいでしょう。

メインループの条件を変更する「pre_get_post」

メインループの条件を変更する場合は「pre_get_posts」というアクションフックを使用します。アクションフックはテーマの「functions.php」内に記述し、具体的なコードは以下の通りです。

function my_custom_query_vars( $query ) {
    if ( !is_admin() && $query->is_main_query()) {
        if ( is_post_type_archive('info') ) {
            $query->set( 'posts_per_page' , 5 );
        }
    }
    return $query;
}
add_action( 'pre_get_posts', 'my_custom_query_vars' );

上記のコードは、「info」という投稿タイプのアーカイブページにおいて、１ページに表示させる記事数を５つにする条件が記述されています。このように設定することで、設定画面で１ページあたり10件の記事を表示させる設定にしている場合でも、この方法でメインループの条件を変更すれば、投稿タイプ「info」は１ページあたり５件ずつ投稿が表示されるようになります。

参考

  • https://web-camp.io/magazine/archives/96425（2023年６月26日確認）
  • https://magazine.techacademy.jp/magazine/39388（2023年６月26日確認）

技術WordPress

Posted by promapedia