記事最終更新日:2017年08月20日
記事投稿日:2017年03月22日
閲覧数:5883 views
WP_Queryで最初と最後だけ違う処理をする方法メモ -【WordPress&PHP】
はじめに
今回のD.M.C.【デベメモドットコム】の記事は「WP_Queryで最初・最後だけ違う処理をする方法」という事で、ちょっとしたテクニックですが普段WordPressで投稿を順番にループで出力する際に、最初の投稿と最後の投稿だけ見た目を変えたいからCSSでid・classを付与したい場合って結構あると思いますので、出来るだけ詳しくメモ(解説)していきたいと思います。
最初だけ違う処理をする方法
WordPressにはページに応じて適切な「投稿・固定」ページの情報が自動的にセットされる、メインクエリと、独自で情報をセットして使うサブクエリがあり、メインクエリで情報をループさせて出力する事をメインループ、独自で情報をセットしたサブクエリでループさせる事をサブループを呼ぶのですが、まずはメインループの際に「最初だけ違う処理をする方法」です。
まずメインループではページに応じた情報が入っている$wp_queryオブジェクトのcurrent_post変数を使って分岐をしていきます。
current_postは現在のループが何番目なのかを保持しており、最初の投稿は0番目になっているので、それをif文で比較して等しかった時に処理をしています。
1ではなく0と比較するところはよく間違う部分だと思うので注意してください。
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php if ($wp_query->current_post == 0) : ?>
// 最初の投稿の処理
<?php endif; ?>
// 通常の投稿の処理
<?php endwhile; ?>
<?php endif; ?>
またCSSでclassを最初と通常のclass名を分けて短く書きたい場合には、三項演算子を使ってみるといいと思います。
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="<?php echo ($wp_query->current_post == 0) ? 'first' : 'default'; ?>">
<?php endwhile; ?>
<?php endif; ?>
サブループの時の場合ですが、基本的にメインループ同じです。
ひとつ気をつける所はサブループの際は独自でパラメータをセットしてWP_Queryオブジェクトをインスタンス化するので、自分で作成したオブジェクト変数のcurrnet_postを使って比較しないといけません。
<?php $params = array(
'key' => 'value',
'key' => 'value',
'key' => 'value',
);
$query = new WP_Query($params);
?>
<?php if ($query->have_posts()) : ?>
<?php while ($query->have_posts()) : $query->the_post(); ?>
<?php if ($query->current_post == 0) : ?>
// 最初の投稿の処理
<?php endif; ?>
// 通常の投稿の処理
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
最後だけ違う処理をする方法
最後だけ違う処理をする場合は、最初だけ処理したい場合の時でも使用したcurrent_post変数を使います。また別で今回はpost_count変数というものもを使います。
post_count変数についてですが、全体の投稿数が入っている変数になっています。
注意点としては、やはりcurrent_postは0から始まっているので比較するpost_countに-1で減らしてから比較をしている所です。
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
// 通常の投稿の処理
<?php if ($wp_query->current_post == $wp_query->post_count - 1) : ?>
// 最後の投稿の処理
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
サブループの時も同じですね。
こちらも気をつける所は最初の時だけ違う処理をする方法の時と同じで、自分で作成したオブジェクト変数のcurrnet_postとpost_count変数はを使って比較しないといけません。
<?php $params = array(
'key' => 'value',
'key' => 'value',
'key' => 'value',
);
$query = new WP_Query($params);
?>
<?php if ($query->have_posts()) : ?>
<?php while ($query->have_posts()) : $query->the_post(); ?>
// 通常の投稿の処理
<?php if ($query->current_post == $query->post_count - 1) : ?>
// 最後の投稿の処理
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
感想
WordPressを使っているとWP_Queryを使う頻度も高いと思いますし、たまにデザイン部分で最初だけ見た目を変えることもあるので今回紹介できてよかったと思います。
次回はWordPressで奇数・偶数の時だけ違う処理をしたい場合や、WP_Queryオブジェクトでサブループを作る時のパラメータの詳細なんかを詳しく紹介できたらと思います。
では最後まで見ていただき、ありがとうございました。
About / ブログについて
D.M.C.【デベメモドットコム】はWEB制作に関することを中心に、
その他、関連する事まで出来るだけわかりやすく備忘録としてメモを残していくブログです。
このブログを通して少しでも為になる情報を発信して皆さんと共有できればとても嬉しいです。