WordPress（ワードプレス）のメインループとサブループの基本的な使い方

ワードプレスでオリジナルのテーマを導入したい方。

また、企業や学校などでホームページをワードプレスで制作したい方。

ワードプレスで作成するほとんどのサイトで本記事で紹介するメインループやサブループが使われています。

ワードプレスをオリジナルのテーマで構築する際に覚えておかなくてはならないものになので、本記事を参考に実際に記述し、どのように表示されているのか体で覚えるような感覚で使えるようにしましょう。

[web_school_link02]

WordPress（ワードプレス）ループとは
メインループ
サブループ
1. get_posts
2. WP_Query
WordPress（ワードプレス）メインループとサブループ：まとめ
1. ワードプレスでおすすめの本

WordPress（ワードプレス）ループとは

ループとはプログラミング言語言う「繰り返し処理」の事いいます。

ワードプレスのループは、投稿記事がある場合、一覧にして表示するように処理されます。

ワードプレスで主に使われているのは、新着情報一覧ページ、アーカイブページ、サイドバーに表示する最近の投稿などになります。

また、トップページや固定ページでも使われる事もあります。

メインループ

投稿を表示するループのことをメインループと言います。

メインループはページにひとつしか使うことができませんので、注意が必要です。

下記は実際のメインループの記述になります。

<?php if ( have_posts() ) : ?>
  <?php while ( have_posts() ) : the_post(); ?>
    <p>表示させたい記事の内容を書き込む</p>
  <?php endwhile;?>
<?php else : ?>
  <p>記事がなかった時に表示される内容を書き込む</p>
<?php endif; ?>

下記ソースは、投稿日時、投稿記事タイトル、投稿記事本文を表示します。
また、記事の投稿が場合は、「お探しの記事は削除されたか移動した可能性がございます。」が表示されます。

<?php if ( have_posts() ) : ?>
  <?php while ( have_posts() ) : the_post(); ?>
    <div><?php the_time( 'Y.m.j' ); ?></div>
    <h2><?php the_title(); ?></h2>
    <p><?php the_content(); ?></p>
  <?php endwhile;?>
  <?php else : ?>
   <p>お探しの記事は削除されたか移動した可能性がございます。</p>
<?php endif; ?>

サブループ

サブループは、任意の条件の投稿記事を読み込むためのループになります。
ページに複数設定することができ、メインループとは別にループを使いたい時に使用します。

サブループには、「get_posts」と「WP_Query」があります。

get_posts

「get_posts」は、任意の条件を指定し、記事の内容を読み込むための関数になります。

下記ソースは、投稿のカテゴリーID「3」に属する記事を7つ読み込むための記述になります。

<?php
　　$args = array (
　　　　'category'       => '3', // カテゴリーID「3」を読み込む
　　　　'post_type'      => 'post', // 投稿を読み込む
　　　　'posts_per_page' => 7, // 記事を7つ読み込む
　　);
　　$posts = get_posts( $args );
　　foreach( $posts as $post ):　setup_postdata($post); 
?>
　　<p>表示させたい記事の内容を書き込む</p>
<?php　endforeach;　?>
<?php　wp_reset_postdata();　?>←忘れずに記述する

WP_Query

「WP_Query」は、任意の条件を指定し、記事の内容を読み込むためのクラスになります。

下記ソースは、カスタム投稿「custom_post」のタクソノミー「custom_post_cat」のターム「custom_post_news」に属する記事を7つ読み込むための記述になります。

<ul>
  <?php $args = array(
    'posts_per_page' => 7, //記事を7つ読み込む
    'post_type' => 'custom_post', //カスタム投稿の「custom_post」の記事を読み込む
    'tax_query' => array(
      array(
        'taxonomy' => 'custom_post_cat', // タクソノミー「custom_post_cat」を読み込む
        'field' => 'slug',
        'terms' => 'custom_post_news', // 「custom_post_cat」のターム「news」に属する記事を読み込む
      )
    )
  ); ?>
  <?php $loop = new WP_Query( $args ); ?>
    <?php if($loop -> have_posts()): ?>
      <?php while($loop -> have_posts()): $loop->the_post();?>
        <li>
          <a href="<?php the_permalink(); ?>">
            <div class="custom_post_contents">
              <div class="custom_post_date"><?php the_time( 'Y.m.j' ); ?></div>
              <div class="custom_post_ttl"><?php the_title(); ?></div>
            </div>
           </a>
         </li>
      <?php endwhile; ?>
    <?php endif; ?>
  <?php wp_reset_postdata(); ?>←忘れずに記述する
</ul>

「get_posts」と「WP_Query」の違いは、取得できる情報量が違います。

「get_posts」は記事の情報を読み込むのに対し、「WP_Query」、ページの情報を読むことができ細かな情報の取得が可能です。

このようにサブループでは自由に任意の記事を読み込むことができます。

特定の記事を固定ページや投稿ページ内で特定の場所に読み込ませたい場合に使用しましょう。

また、上記のソースはサブループで読み込みのできるほんの一部を紹介しています。この他にも上記とは異なる記述方法のやさらに細かな指定ができますので、下記関数リファレンスを参考に色々指定してみましょう。

https://wpdocs.osdn.jp/関数リファレンス/WP_Query