新しいトップページをつくってみた
②固定ページに投稿を読み込む
トップページ制作過程の第２回目は、
トップページのテンプレート（front-page.php)に投稿を読み込む方法をご紹介します。
・固定ページに投稿を読み込むには、
1.WP_Queryについて
固定ページに投稿を読み込むには、「WP_Query」というクラスを使います。
WP_Queryとは、WordPressのコアにあるクラスの１つで、様々な条件を指定して投稿などを読み込むことができます。
2.WP_Queryの使い方
具体的にWP_Queryの使い方をご説明します。
以下のソースがWP_Queryの基本的な使い方になります。
|
1 2 3 4 5 6 7 |
<?php $変数名= new WP_Query(パラメータ); ?> <?php if($変数名->have_posts()): while($変数名->have_posts()): $変数名->the_post(); ?> 投稿の情報を出力する処理 <?php endwhile; endif; ?> <?php wp_reset_postdata(); ?> |
1行目で、WP_Queryのオブジェクトを生成しています。パラメータには読み込みたい投稿の条件を指定します。（パラメータは後述のサンプルでいくつかご紹介します。）
３行目〜５行目がループ処理になります。
have_posts()やthe_post()等の関数は、WP_Queryクラスのメソッドとして実行しています。
ループ処理の中にthe_title等のテンプレートタグ関数を使って投稿情報を出力できます。
ループ処理が終わったら、7行目の「wp_reset_postdata」という関数を実行し、グローバル変数等を初期化し、状態を元に戻しておきます。
3.サンプル
実際に新しいトップページで使ったWP_Queryの条件をサンプルとしてご紹介します。
なお、処理は、すべて新しいトップページのテンプレート（front-page.php）に記載します。
最新記事６件分のアイキャッチ画像を表示する
|
1 2 3 4 5 6 7 8 9 10 11 |
<?php $the_query = new WP_Query(array('orderby'=>'date', 'posts_per_page' => 6)); ?> <?php if($the_query->have_posts()): while($the_query->have_posts()): $the_query->the_post(); ?> <?php if( has_post_thumbnail() ): ?> <?php the_post_thumbnail( array( 426, 284 ) ); ?> <?php endif; ?> <?php endwhile; endif; ?> <?php wp_reset_postdata(); ?> |
1行目のWP_Queryのパラメータは、連想配列で指定しています。
orderbyは、パラメータで指定した項目の値で投稿をソートします。
今回、dateを指定しましたので、投稿した日付順にソートしています。
posts_per_pageは、投稿数を指定します。今回は、６件分指定しています。
あとは、ループ処理の中にアイキャッチ画像（426px,284px)を読み込む処理を入れれば、最新記事６件分のアイキャッチ画像が表示されます。
WordPress関連の全記事のアイキャッチ画像を表示させる
|
1 2 3 4 5 6 7 8 9 10 11 |
<?php $the_query = new WP_Query(array('category_name' => 'wordpress', 'posts_per_page' => -1)); ?> <?php if($the_query->have_posts()): while($the_query->have_posts()): $the_query->the_post(); ?> <?php if( has_post_thumbnail() ): ?> <?php the_post_thumbnail( array( 426, 284 ) ); ?> <?php endif; ?> <?php endwhile; endif; ?> <?php wp_reset_postdata(); ?> |
1行目のcategory_nameで指定したいカテゴリーのスラッグを設定します。
今回は、wordpressカテゴリーの投稿を読み込みたいので、wordpressを指定しています。
また、’posts_per_page’ => -1を指定すると、すべての投稿を読み込みます。
4.最後に
以上、WP_Queryを使って固定ページに投稿を読み込む方法をご紹介しました。
WP_Queryのパラメータには、他にも色々条件が指定できますので、
以下のサイトを参考にしてみてください。
関数リファレンス（WP_Query）
少しでも参考になれば幸いです。
スポンサーリンク
