WordPressの投稿ループを理解する|仕組みと使い方

WordPressで投稿を一覧表示するために欠かせないのが「ループ」です。このループによって投稿のタイトルや本文などの情報を取得・出力することができます。

WordPressのループは、投稿を表示するための基本的かつ重要な仕組みです。ループの仕組みや活用方法を知っていると、意図した通りに表示させやすく、カスタマイズの幅が広がります。

そこでこの記事では、WordPressループの基本から応用までをまとめていきます。

WordPressループとは?

プログラミングのループとは、指定した条件を満たすまで特定の処理を繰り返すことを指します。

そしてWordPressのループは、have_posts()the_post() という関数を使って、投稿データをデータベースから1件ずつ繰り返し取得し、ページ上に表示する仕組みです。

投稿取得→have_posts()で投稿があるか確認→(have_postsがtrue判定だったら)the-post()で1件ずつデータを準備→1件ずつ順番に投稿内容を出力→(have_postsがfalse判定になったら)ループ終了

アーカイブ・カテゴリーページの投稿一覧やサイドバーなどに表示される新着記事や関連記事の一覧、また1つの記事情報だけが必要な投稿詳細ページでも、WordPressではループを利用して情報を取得し表示させています。

併せて知っておきたいクエリについて

ループにはクエリが利用されるため、クエリがどういったものなのかも知っておきたいところです。

クエリはデータベースに対して処理要求(問い合わせ)をするものです。

投稿した情報はデータベースに保存されています。投稿記事を表示させるには、データベースから表示させたい記事を指定しなければなりません。クエリによって表示させたい記事の条件を絞り込んでデータベースにその情報を要求することができます。

WordPressではアクセスしたURLによって自動的にデータを取得しています。

WordPressでは簡単にURLをカスタムできるので、この形のままのURL設定にすることはあまりないかもしれませんが、作成した記事の本来のURLは、パーマリンク設定の「基本」の形です。

https://example.com/?p=1234

基本の形を見てみると取得される内容が分かりやすいです。「?」以降にある内容が記事を取得するための条件になっています。これがクエリです。
上記の形だと「投稿IDが1234の記事」を条件にデータベースへリクエストして、情報を読み取っています。

取得したデータは $wp_query というオブジェクトに保存します。そして保存された情報をループ処理によって引き出します。

URLによってあらかじめ決められた条件を「メインクエリ」、それ以外にこちらから指定するものを「サブクエリ」と言います。

メインループとサブループ | 違いや使い方

ループにはメインループとサブループと呼ばれるものがあります。

メインループとサブループの違いは、WordPressが自動的に取得するメインクエリで処理するのがメインループ、こちら側で指定したサブクエリで実行するのがサブループです。

メインループWordPress側で自動的に取得した投稿データをそのまま使用して取得・表示
(メインクエリを使ったループ)
サブループメインループとは異なる条件をこちらで指定して取得・表示
(サブクエリを使ったループ)

サブループは便利な機能ですが、基本的にはメインループで対応できないか考えましょう。ページにアクセスした時には自動的に決まった条件での要求はしているため、これで済ませられた方が処理速度は早いです。

メインループサブループ
WP_Query
get_posts
pre_get_posts

メインループの基本コード

メインループはこのベーシックな形に表示させたい内容を変更します。
このコードでは、投稿データがあればその数だけタイトルと本文が繰り返し表示され、なければ何も表示されません。

PHP
<?php if ( have_posts() ) : ?>
  <!-- もし投稿があった場合に処理する内容 -->
  <?php while ( have_posts() ) : the_post(); ?>
    <!-- 繰り返し処理・表示すること -->
    <h2><?php the_title(); ?></h2>
    <div><?php the_content(); ?></div>
  <?php endwhile; ?>
  <!-- ループ処理が終わった後に処理する内容 -->
<?php else: ?>
  <!-- 取得する投稿が1件もなかった時に処理する内容 -->
<?php endif; ?>

メインループは、「トップページでは3件まで」「カテゴリー一覧ページでは10件まで」のように、ページごとに条件を変更することができます。

一つのページに複数のループを使用する際に、「同一ページ内で各ループごとに条件を変える」ということはできないため、こういったメインループだけでは対応が難しい場合にサブループを使用します。
とあるカテゴリーページで別のカテゴリー記事も表示させたい、個別ページに関連記事などを表示させたい、カスタム投稿タイプの記事一覧を表示させたいと言った場合などがあげられます。

WP_Queryによるサブループ例

WP_Query クラスを使用し、投稿タイプ・カテゴリ・タグ・日付など、表示させたい投稿の条件を指定して独自のループを作成できます。

PHP
<?php
  $args = array(
    'post_type' => 'post',
    'category_name' => 'news',
    'posts_per_page' => 5
  );
  
  $the_query = new WP_Query($args);
  
  if ( $the_query->have_posts() ) :
    while ( $the_query->have_posts() ) : $the_query->the_post();
      echo '<h3>' . get_the_title() . '</h3>';
    endwhile;
    wp_reset_postdata();
  endif;
?>

ループ内で使用する関数の意味

関数名用途
have_posts()投稿が残っているかを判定
the_post()次の投稿情報を準備
get_posts()シンプルなカスタムループを実装
wp_reset_postdata()メインループの状態に戻す

条件分岐タグの使い方(is_homeなど)

ループと一緒に使われるのが条件分岐タグです。表示するページによって処理を変更したいときに使います。

  • is_home():ブログトップページかどうか
  • is_single():個別投稿ページかどうか
  • is_category():カテゴリページかどうか

条件分岐によって、表示内容を柔軟に切り替えられます。

ループでよくあるトラブルと対策

サブループ後にメインループが壊れる

サブループに wp_reset_postdata() があるか確認。

投稿が出力されない

コード間違いがないか。正しいパラメーターを使用しているか、idやスラッグなど値が正しいものか確認。カンマ「,」が抜けているなど些細なミスで表示されないことも多いので、コードの書き方に間違いがないかも見直してみましょう。
クエリ条件の見直し、キャッシュ確認なども確認項目の一つです。

サブループで the_title() といった出力関数で表示されない

setup_postdata() を使用する。

カテゴリー : WordPress