WordPressカスタムクエリ–複数のループ

公開: 2021-01-29

ほとんどの場合、WordPressでWebサイトを構築する場合、[設定]> [読み取り]の管理オプションから静的ページを表示することを選択しない限り、アクティブ化するテーマはデフォルトで最近の投稿を一覧表示するフロントページを表示します。 しかし、静的ページでも最新の投稿でもない別の範囲のコンテンツを表示したい場合はどうでしょうか。 幸い、これはWordPressの複数のループを使用して可能です。

これをどのように達成できるか見てみましょう!

WordPressホームページで複数のループを使用する

開始する前に、テーマのテンプレートファイルを編集するため、子テーマを使用して自分のWebサイトにこれらの変更を実行する必要があることに注意してください。 これを行わないと、次にテーマを更新するときに行った変更が失われることになります。 子のテーマについて詳しくは、こちらをご覧ください。

使用しているテーマに関係なく、ホームページに対応するPHPファイルには、いくつかの投稿を表示する標準ループが含まれます(ほとんどの場合、これは最近公開された投稿になります)。 たとえば、Twenty Twentyテーマでは、79行目あたりのindex.phpファイル内にこれを制御するコードがあります。

 if ( have_posts() ) { $i = 0; while ( have_posts() ) { $i++; if ( $i > 1 ) { echo '<hr class="post-separator styled-separator is-style-wide section-inner" aria-hidden="true" />'; } the_post(); get_template_part( 'template-parts/content', get_post_type() ); } }

このような標準ループでは、2つの重要なグローバル変数が使用されます。

  • WP_Queryクラスオブジェクトであり、WPデータベースクエリ結果を保持する$wp_query
  • 現在のWP_Postクラスオブジェクトである$post

上記のコードでは、最初にhave_posts()グローバル関数で表示する投稿があるかどうかを確認し、ある場合は、whileループ内でこれらの投稿を繰り返し処理します。 the_post()グローバル関数は、WordPressに次の投稿に進むように指示する投稿を反復処理する関数です。

これらの関数とクラスの詳細を確認したい場合は、 wp-includes/class-wp-query.phpファイルで見つけることができます。

この例では、Twenty Twentyテーマをアクティブにしてから、「カテゴリ1」というカテゴリの下に6つの投稿を作成し、「サービス」というカテゴリの下に5つのサービス投稿を作成しました。

物事を簡単にするために、投稿のタイトルのリストのみを表示することにより、ループコードを可能な限り単純に保ちます。

 if ( have_posts() ) { while ( have_posts() ) { the_post(); the_title( '<h3 class="entry-title">', '</h3>' ); } }

これは、私たちのホームページに次のようなものが表示されることを意味します。

はじめにホームページ出力のカスタマイズ

上のスクリーンショットからわかるように、「フロントページ」にアクセスすると、割り当てられているカテゴリに関係なく、最新の10件の投稿が表示されます。

次に、カスタマイズされた出力を含める独自のカスタムホームページテンプレートの作成に進みます。

これを行うには、 custom-homepage.phpというファイルを作成し、テーマのフォルダーに保存します。 このページに次のコードを追加します。

 <?php /* * Template Name: My custom homepage template */ get_header(); if ( have_posts() ) { while ( have_posts() ) { the_post(); the_title( '<h4 class="example"></h4>' ); } } get_footer();

次に、WordPress管理者に移動し、「マイホームページ」というページを作成し、「テンプレート」ドロップダウンメニューから「マイホームページテンプレート」をテンプレートとして選択します。

次に、これをデフォルトのホームページにするには、[設定]メニュー([設定]>[読み取り]>[静的ページ])でこれを選択する必要があります。

この時点で、ホームページを見ると、Webサイトのフロントエンドから見たときにページタイトルのみが表示されているはずです。

これでこの設定が完了しました。「マイカスタムホームページテンプレート」テンプレートにいくつかのクエリを追加しましょう。

カスタムクエリの追加

この例での目標は、すべてのカテゴリの最新の投稿の一部を表示することです。 この下に、「本」と呼ばれるカスタム投稿タイプの投稿を表示します。 カスタム投稿タイプを設定する方法がわからない場合は、「WordPressカスタム投稿タイプを手動で作成する」の記事をチェックアウトしてください。 もちろん、カスタム投稿タイプを含めることは完全にオプションです。 これを行いたくない場合は、この投稿タイプを参照する手順をスキップしてください。

現在のループ( index.phpの79行目あたりにあります)を次のループに置き換えることから始めましょう。

 $args = array( 'posts_per_page' => 8, 'orderby', 'date', 'order', 'DESC' ); $query = new WP_Query( $args ); while ( $query->have_posts() ) : $query->the_post(); the_title( '<h4 class="example"></h4>' ); endwhile;

このループは、ホームページに最新の8つの投稿が表示されることを意味します(以下を参照)。

次に、カスタム投稿タイプ「本」(またはその他のカスタム投稿タイプ)を含める場合は、次のように、最初のループのすぐ下に本の投稿用の2番目のループを追加します。

 echo '<h4>Books</h4>'; $args = array( 'post_type' => 'book', 'posts_per_page' => 8 ); $query = new WP_Query( $args ); while ($query->have_posts()) : $query->the_post(); the_title( '<h4 class="example"></h4>' ); endwhile;

Webサイトのフロントエンドに移動し、ページを更新して、すべてが期待どおりに機能していることを確認します。

カスタムクエリを部分的に分割する

カスタムクエリをパーツに分割すると便利な場合があります。 これを行う理由は、最初のループを再開する前に、別のカテゴリまたは投稿タイプからの投稿を表示して最初のクエリを「中断」したい場合です。 これは、たとえば、カテゴリの最新の投稿を表示してから他のコンテンツを表示してから、最終的にさらに「最新の投稿」でページを終了する場合に便利です。

これに飛び込みましょう。 まず、前に使用したcustom-homepage.phpファイルの内容を削除し、以下のコードを追加します。

 <?php /* * Template Name: My custom homepage template */ get_header(); //////////// // Services Posts loop echo '<h4>Services</h4>'; $args = array( 'posts_per_page' => 3, 'category_name'=> 'services' ); $services = new WP_Query( $args ); while ( $services->have_posts() ) : $services->the_post(); the_title( '<h4 class="example"></h4>' ); endwhile; // Books Posts in between echo '<h4>Books</h4>'; $args = array( 'post_type' => 'book', ); $books = new WP_Query( $args ); while ( $books->have_posts() ) : $books->the_post(); the_title( '<h4 class="example"></h4>' ); endwhile; // Resume Services Posts loop echo '<h4>More Services</h4>'; $args = array( 'offset' => '3', 'posts_per_page' => 3, 'category_name'=> 'services' ); $services = new WP_Query( $args ); while ( $services->have_posts() ) : $services->the_post(); the_title( '<h4 class="example"></h4>' ); endwhile; //////////// get_footer();

最初のループでは、サービスカテゴリから3つの投稿を取得します。 重複を避けながら、3番目のループでサービスカテゴリの投稿を再開するために、オフセット=> 3を定義します。 これは、次のように表示されることを意味します。

もちろん、オフセット値を任意の数に変更できます。

最新の投稿クエリにカスタム投稿を追加する

ホームページの最新の投稿に本の投稿を含めたい場合はどうなりますか? デフォルトのループには、デフォルトではカスタム投稿は含まれていません。 これを修正する方法は次のとおりです。

このセクションでは、ホームページの読み取り設定を「最新の投稿」に設定します。

ここでたどるルートは、 pre_get_postsフックを使用することです。 このフックはwp-includes/class-wp-query.phpファイルに導入されており、必要に応じて$queryオブジェクトとメインのWordPressループをカスタマイズするために使用されます。 クエリ変数オブジェクトが作成された後、実際のクエリが実行される前に実行されます。

アクティブなテーマのfunctions.phpファイルを開き、最後に次のコードを挿入します。

 function homepage_add_cpt( $query ) { if ( $query->is_main_query() && is_home() ) { $query->set( 'post_type', array( 'post', 'book' ) ); } } add_action( 'pre_get_posts', 'homepage_add_cpt' );

このコードがif条件で行うことは、メインクエリの実行中にのみ変更がホームページに適用されるようにすることです。

ここでホームページにアクセスすると、最新の投稿にカスタムの「本」の投稿も含まれていることがわかります。

結論

ほぼ例外なく、WordPressホームページのコンテンツに関して達成する必要のあることは何でも可能です。 ここで示したように、WordPressの複数のループを使用することは、ホームページに表示される出力をカスタマイズするための強力な方法です。 ここでの私たちのアプローチは、多くのアプローチの1つにすぎません。 WordPressは、サイトに表示される出力に対して信じられないほどのレベルの制御を提供します。 彼らが提供するツールを試して、あなたが望むものを達成してください!