WordPressのフロントページをカスタム投稿の一覧にする

 

株式会社オンラインの金沢です。

 

WordPressの標準設定では、フロントページのメインクエリは「投稿」の記事が10件表示さるようになっています。ブログサイトであればそのままでもよいのですが、CMSとしてWordPressを使用している場合はいらないことが多いですよね。「投稿」をニュースCMSとして利用するのも「カテゴリー」や「タグ」が邪魔になりますし。

そこで今回は、カスタム投稿タイプ「news」をフロントページに一覧を表示させる方法の中で、メインクエリのパラメータを変えることで実現させる手法を簡単に紹介させて頂きます。ニュース以外の新着情報にも活用できます。

 

使用中のテーマが上記のような「投稿」を10件表示する基本的なものであれば、functions.phpに下記のようなコードを記述するだけで済みます。関数名はいつもながらの安易なネーミングです。

function online_pre_get_post( $query ) {
	if ( is_admin() || ! is_main_query() ) {
		return;
	}
	if ( is_front_page() ) {
		$query->set( 'post_type', 'news' );
	}
}
add_action( 'pre_get_posts', 'online_pre_get_post' );

 

オリジナルテーマなどの場合はfront-page.phpもしくはhome.phpにメインクエリのループを書き加えましょう。日付とタイトルをリストタグで表示する例を示します。

<ul>
	<?php
	while( have_posts() ) :
		the_post();
		?>
		<li><?php the_date(); ?><br /><?php the_title(); ?></li>
		<?php
	endwhile;
	?>
</ul>

 

これだけです。簡単でしょう?

更に、一覧の条件を変えたい場合は、functions.phpに記述を変更します。定義した関数で引数として呼び出した「$query」オブジェクトのメソッド「set」によりクエリパラメータを追加・変更できるのですから、その辺りを変更します。次の例は、先の一覧を5件のみにする場合です。

function online_pre_get_post( $query ) {
	if ( is_admin() || ! is_main_query() ) {
		return;
	}
	if ( is_front_page() ) {
		$query->set( 'post_type', 'news' );
		$query->set( 'posts_per_page', 5 );
	}
}
add_action( 'pre_get_posts', 'online_pre_get_post' );

 

パラメータはリファレンスの「WP_Query」を参照してください。第二引数は配列を指定することもできます。配列で指定することで、たとえば「post_type」を複数指定することができます。

 

ちなみに、「pre_get_posts」をフックさせるコードをfront-page.phpに書けば、条件文が省略できてもっと簡単になるかとも思いましたが、うまく動きませんでした。メインクエリが実行される前にフックさせなければなりませんから、テンプレートファイルでは遅すぎるのでしょうかねぇ。テンプレートファイルは実行結果を表示させるファイルとも言えますから、後回しにされるのは当然と言えばそうなのですが、同じディレクトリに保存されているfunctions.phpとこのような違いがあるとは、ちょっとしたカルチャーショックです。WordPressの文化は奥が深いですね。

金沢

 

著者プロフィール

金沢大樹

2年間のアルバイトを経て、平成27年度より社員として株式会社オンラインでWeb制作をしております。
WordPressを得意としており、プラグイン開発の経験もございます。
また、Monacaを使用したスマートフォンアプリ開発や、Visual BasicによるWindowsアプリケーション開発もできます。

コメントを残す

コメントは管理者による承認後に公開されます。

CAPTCHA