WordPress記事一覧を固定ページに表示させる

WordPress記事一覧を固定ページに表示させる方法としては、index.phpやcategory.php、tag.phpなどアーカイブ用のテンプレートを作成すれば記事一覧を表示させることができます。

また、カスタム投稿タイプ記事一覧はarchive-slug.php、タクソノミー記事一覧はtaxonomy-slug.phpといったテンプレートを用意することで、それぞれのコンテンツに合わせた記事一覧ページを作成する事も可能です。

ただ、先述したように、サイトトップなどの固定ページで記事一覧を表示させたいケースというのも需要があり、実際の制作でもコーポレートサイトなどで多用することが多いものであったりします。

WordPressでは、固定ページ用にテンプレートを用意して下記をマークアップすることにより、好きな場所に記事一覧を表示させることができます。

<?php
	$wp_query = new WP_Query();
	$my_posts = array(
		'post_type' => 'post',
		'posts_per_page'=> '6',
	);
	$wp_query->query( $my_posts );
	if( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post();
?>
	// ここにコンテンツ
<?php endwhile; endif; wp_reset_postdata(); ?>

上記では、ブログ全記事を6記事表示させることができます。

4行目の'post'で、どの記事を表示させるか指定しています。

もしカスタム投稿タイプの記事一覧を表示させたい場合には、カスタム投稿タイプのスラッグにする事で指定した記事一覧が表示されます。たとえば、スラッグが『information』の記事一覧を表示させたい場合には、4行目を'post_type' => 'information',にするだけです。

また、特定のカテゴリ記事一覧を表示させるには、下記のように記述します。

<?php
	$wp_query = new WP_Query();
	$my_posts = array(
		'post_type' => 'post',
		'category_name' => 'wordpress',
		'posts_per_page'=> '6',
	);
	$wp_query->query( $my_posts );
	if( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post();
?>
	// ここにコンテンツ
<?php endwhile; endif; wp_reset_postdata(); ?>

5行目を追加して、カテゴリーのスラッグを指定します（上記では'wordpress'の部分）。

と、このようにさまざまなタイプの記事一覧を表示させることができるのですが、1ページ内で複数の記事一覧を表示させる場合には、記述をちょっとだけ変更しないといけないのです。

WordPress固定ページに複数のポストタイプの記事一覧を表示させる

複数のポストタイプの記事一覧を固定ページ1ページ内に表示させるには、以下のようにします。

WordPressブログ全記事一覧

<?php
	$wp_query = new WP_Query();
	$my_posts01 = array(
		'post_type' => 'post',
		'posts_per_page'=> '6',
	);
	$wp_query->query( $my_posts01 );
	if( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post();
?>
	// ここにコンテンツ
<?php endwhile; endif; wp_reset_postdata(); ?>

カテゴリー記事一覧

<?php
	$wp_query = new WP_Query();
	$my_posts02 = array(
		'post_type' => 'post',
		'category_name' => 'wordpress',
		'posts_per_page'=> '6',
	);
	$wp_query->query( $my_posts02 );
	if( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post();
?>
	// ここにコンテンツ
<?php endwhile; endif; wp_reset_postdata(); ?>

カスタム投稿タイプ記事一覧

<?php
	$wp_query = new WP_Query();
	$my_posts03 = array(
		'post_type' => 'information',
		'posts_per_page'=> '6',
	);
	$wp_query->query( $my_posts03 );
	if( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post();
?>
	// ここにコンテンツ
<?php endwhile; endif; wp_reset_postdata(); ?>

$my_postsの部分を、$my_posts01$my_posts02$my_posts03とそれぞれ別に指定する必要があります。ここでは見やすいように数字で分けておりますが、コンテンツに合わせてネーミングした方が後で編集する際に分かりやすいかと思います。

1ページ内で複数の記事一覧を表示させたい場合には、先述したように呼び出す値をそれぞれ分ける必要がありますので、この点は注意が必要です。

以前に私がハマったところでもあったのでご紹介してみました。よく利用することがあるので、備忘録的な記事でもあったりしますが…。まぁ、みなさんもトップページを制作していてうまく表示できない場合には、ここをチェックしてみてください。