WordPressのクラスであるWP_Queryはサイト内の全ページの中から例えば「カテゴリーid15の投稿を日にちの新しい順に5件呼び出す」という条件を設定して記事を呼び出す時に使います。
このサイトで利用しているコードから一つ一つ細かく解説します。
ページ内リンク
WP_Queryをどんな時に使うのか
このサイトでは各固定ページに各カテゴリー毎の記事を抜粋表示しています。
例えば「WordPress」という固定ページをご覧ください。
カテゴリーが「WordPress」に設定されている記事のタイトルや投稿内容の抜粋を全ページの中から集めて表示しています。
このカテゴリー毎に記事集める為に利用しているプログラムがWP_Queryです。
編集欄にphpプログラムは入力できません
WordPressの「投稿・固定ページの編集」の本文入力欄にphpプログラムを直接入力する事はできません。
セキュリティーの問題やWordPressの動作に影響を与える問題等があるからのようです。
入力しても「<!–」と「–>」で囲われ表示されず、プログラムは動作しません。
プログラムとして認識させる為にはテンプレートファイルに直接入力するか、ショートコードを設定して編集ページ本文入力欄に入力するかしなければなりません。
この記事でWP_Queryをご理解いただいても上記のどちらかで入力しなければ利用することができません。
HaradaWebでは後者のショートコードを利用しています。
WordPressで投稿・固定ページでphpファイルを子テーマでも利用できるショートコード
WP_Queryのサンプルと解説
WP_Queryでカテゴリーid15の記事を5件取得して日付の最新順で表示するコードです。
<?php $qqposts = new WP_Query( array( 'cat'=>15, 'posts_per_page' => 5 ) ); if ( $qqposts->have_posts() ) : while ( $qqposts->have_posts() ) : $qqposts->the_post(); ?> <?php get_template_part( 'loo','con' ); ?> //loo-con.phpファイルの内容が繰り返し表示されます。 <?php endwhile; wp_reset_postdata(); else :?> //カテゴリーid15の記事がない場合の表示をここに設定 <?php endif; ?>
サンプル中のWP_Queryの解説
$qqposts = new WP_Query(
のnew WP_Queryは指定した条件(投稿、固定ページ、カテゴリー、タグ、年月日、フィード、検索等)で記事の情報を取得します。
$qqposts = new WP_Query(は変数$qqpostsにnew WP_Query(とこの後記述されている記事を取得する為の条件内容(パラメーター)を格納するという事です。
$qqpostsは変数なので自分の好きな名前を設定してください。
9行目までが条件内容になります。
array(
は簡単な説明ですが、条件内容が複数ある時に使ものです。
array()でくくります。
パラメーターの解説
パラメーターとは外部から投入される値で、その投入された内部に影響を与える(与えないものもある)ものです。
サンプルコードの4-7行目までがパラメーターです。
‘cat’=>15,
はカテゴリーid15を指定しています。
‘orderby’=>date,
は’orderby’が取得した記事情報を並べる為の基準で、dateは日にちという事で、日にちを基準に並べるという事です。
‘order’=>DESC,
のorderは昇順か降順かを指定するパラメーターです。
DESCは降順なので、新しい日付の順番という事になります。
2018年9月4日まで上記の様に
「‘orderby’=>date,’order’=>DESC,」
と記載していました。
しかしこれがサーバーのPHP72でエラー予告表示されます。
「‘orderby’=>date,’order’=>DESC,」この二つを削除するとエラー警告は消えます。
詳しくは
サイト内リンク:サーバーのPHP72でWp-Queryのエラー | HaradaWeb(ハラダウェブ)
に記載しています。
‘posts_per_page’ => 5
のposts_per_pageは取得する記事の件数です。
全部の記事を取得する場合「-1」と入力します。今回の場合は5件の記事です。
ループのif(have_posts())とwhile(have_posts())の解説
ループとはPHPコードでWordPressの投稿を表示させるものです。
if ( $qqposts->have_posts() ) :
のifはif文で「もし()の内容があるなら」という事です。
have_posts()は記事があるかないかを確認しています。
あればTRUE(真)無ければFALSE(偽)を返します。
つまりif ( $qqposts->have_posts() ) はもし$qqpostsに格納されている条件の記事があれば、という事です。
while ( $qqposts->have_posts() ) : $qqposts->the_post();
のwhileの英語の言葉の意味は「~する間は」です。
whileはPHPコードでは繰り返し続けるという働きがあります。
the_post()は繰り返しを次の記事へ進める働きがあります。
whileが繰り返しを続けて、the_post()が次の記事へ進めていくという動作です。
the_post()がないと条件内容の1番目の記事を何度も永遠に表示し続けます。
while ( $qqposts->have_posts() ) : $qqposts->the_post()は$qqpostsの条件内容で一つ一つ記事を表示していくという事です。
「->」アロー演算子の解説
$qqposts->have_posts()
の->はPHPの演算子の一つでアロー演算子といいます。
->を挟んで左側の変数に複数の要素が入っていて、その中から右側の条件のものを取り出します。
get_template_part( ‘loo’,’con’ )の解説
get_template_part( ‘loo’,’con’ )は独自に作ったloo-con.phpファイルを呼び出しています。
中身はWP_Queryで呼び出した記事を抜粋表示する為のHTMLが記述されています。
loo-con.phpファイルの中身です。
<div class="mainpage"> <h2> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </h2> <div class="mainpage-content"> <?php the_content(''); ?> </div> <div class="mainpage-sub"> <span class="mainpage-date"> <?php echo get_the_date(); ?> </span> <span class="mainpage-cat"> <?php the_category(' '); ?> </span> <span class="mainpage-tuzuki"> <a href="<?php the_permalink(); ?>">続きを読む→</a> </span> </div> </div>
各固定ページ
WordPress
jQuery
CSS
の抜粋内容のデザインを統一する為、get_template_part( ‘loo’,’con’ )を設定しています。
endwhileの解説
endwhileはwhile ( $qqposts->have_posts() )が繰り返す時の折り返しポイントになります。
プログラムは基本的に上から順番に処理されていきます。
while(have_posts())からendwhileまでの内容が表示されて、endwhileまできたら再びwhile(have_posts())の所に戻り、the_post()で次の記事があれば同じ作業を繰り返していく、というイメージです。
今回の場合は$qqpostsの条件内容の記事がある限りget_template_part( ‘loo’,’con’ )の内容が繰り返し表示されます。
wp_reset_postdataの解説
wp_reset_postdataとはグローバル変数の$postを復元させるためものです。
WP_Queryを利用する事で、グローバル変数の$postは書き換えられています。
それを元に戻すのがwp_reset_postdataです。
と、これが公式的な説明になります。
WP_Queryを使って得た記事の情報はthe_post()でグローバル変数$postに格納されている状態にあります。
その状態を通常のメインクエリの為に利用するグローバル変数$postの状態に戻すという事です。
もっとわかりやすく言えばwp_reset_postdataと記述する事でWP_Queryの動作を終了させるという事です。
WP_Queryを使ったら最後はendwhileで終了させるとペアのようなものと覚えてください。
elseとendifの解説
elseとendifはif文の一部です。
if(have_posts())はif文という説明をしました。「もし()の内容があるなら」という意味です。
elseは「()の内容がないなら」という事です。
今回の場合で「()の内容がないなら」「カテゴリーid15の記事がない場合の表示をここに設定」としてあります。ない場合のHTMLを記述してください。
endifはif文の終了を意味します。
これでWP_Queryのサンプルの解説は終了です。
パラメーターにつて
今回は一つのカテゴリーidで記事を取得しました。
WP_Queryで利用できるパラメーターはまだまだたくさんあります。
タグ、ページのスラッグ名、投稿日時、ユーザー、パスワード、カスタム投稿、カスタム投稿タクソノミー、カスタムフィールド等々を複数設定したり色々な条件で記事を取得できます。
どのようなパラメーターが利用できるか、詳しくは
関数リファレンス/WP Query#パラメーター
でご確認ください。
関数リファレンス/WP Query#パラメーターではパラメーターを設定する際、$query = new WP_Query( ‘cat=4’ );と表記されています。
‘cat=4’の箇所をこのページでは’cat’=>15と記述しています。
どちらでもいいのですが、「=」と「=>」は一緒には使えないので注意してください。
「=」を使用する時は&も使用して全てのパラメーターで使用するよう統一してください。