【WordPress】複数の投稿タイプの一覧をまとめて表示する方法【固定ページを使います】
こんにちは、Webデザイナー・コーダーのsowです。
今回は複数のカスタム投稿（投稿タイプ）を固定ページに一覧表示する方法の紹介です。
ワードプレスでは、複数の投稿タイプを運用する場合があると思います。
カスタム投稿の一覧ページは投稿タイプのスラッグがURLになります。
例えば投稿タイプ１のスラッグが「blog_cat_1」の場合、一覧ページのURLは example.com/blog/blog_cat_1になります。
同じく投稿タイプ２のスラッグが「blog_cat_2」なら、一覧ページはexample.com/blog/blog_cat_2というようになります。
ですが、この投稿タイプ１と２をまとめて一覧表示したい場合はどうしたら良いのでしょうか。
今回はこのように、２つの投稿タイプを一覧表示する方法を解説していきます。
この記事の目次
固定ページで一覧を表示する
２つの投稿タイプの一覧表示には、固定ページを使用します。
固定ページのテンプレートファイルはpage.phpですが、
表示用にこのpage.phpをコピーして、ファイル名をpage-news.php等の「page-〇〇.php」という名前に変更します。
こうすることにより、〇〇の部分の「news」というスラッグ（URL）の固定ページ用テンプレートファイルになります。
そしてこの example.com/news/ という固定ページに２つの投稿タイプをまとめて一覧表示させます。
下記のコードが固定ページでカスタム投稿を表示するものです。
固定ページにカスタム投稿を表示するコード 1
8行目、10行目で投稿タイプ名とタクソノミーを変更してください。
<?php
$paged = (int) get_query_var('paged');
$args = array(
'posts_per_page' => 5,
'paged' => $paged,
'orderby' => 'post_date',
'order' => 'DESC',
'post_type' => array('投稿タイプ１','投稿タイプ2'),
'post_status' => 'publish'
);
$the_query = new WP_Query($args);
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<?php
$product_terms = wp_get_object_terms($post->ID, array('タクソノミー１','タクソノミー２','タクソノミー3'));
if(!empty($product_terms)){
if(!is_wp_error( $product_terms )){
foreach($product_terms as $term){
echo '<span class="category_tag '.$term->slug.'">'.$term->name.'</span>';
}}}
?>
<time class="post-date" datetime="<?php echo get_the_date( 'Y-m-d' ); ?>"><?php the_time( get_option( 'date_format' ) ); ?></time>
<div class="post flex">
<a href="<?php the_permalink(); ?>" class="thumbnail-box"><?php the_post_thumbnail(); ?></a>
<div class="summary">
<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<p class="btn"><a href="<?php the_permalink(); ?>" class="thumbnail-box">READ MORE</a></p>
</div>
</div>
<?php endwhile; ?>
<?php else : ?>
<div class="post">
<h3>Not Found</h3>
<p>Sorry, but you are looking for something that isn't here.</p>
</div>
<?php endif; /** ループ終了 */ ?>
<div class="pagination">
<?php
if ($the_query->max_num_pages > 1) {
echo paginate_links(array(
'base' => get_pagenum_link(1) . '%_%',
'format' => 'page/%#%/',
'current' => max(1, $paged),
'total' => $the_query->max_num_pages
));
} ?>固定ページにカスタム投稿を表示するコード 2 （コンテンツ表示部分は別ファイル読み込み型）
このコードはスターターテーマのアンダースコアズ（_s）を利用したものですが、
15行目~19行目でコンテンツ表示用の外部ファイルを読み込んでいます。
最初に紹介したコードの１５行目〜40行目にあたります。
<?php
$paged = (int) get_query_var('paged');
$args = array(
'posts_per_page' => 5,
'paged' => $paged,
'orderby' => 'post_date',
'order' => 'DESC',
'post_type' => array('投稿タイプ１','投稿タイプ２'),
'post_status' => 'publish'
);
$the_query = new WP_Query($args);
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<?php get_template_part( 'template-parts/content', 'archive' ); ?>
<?php endwhile;
else:
get_template_part( 'content', 'none' );
endif; ?>
<div class="pagination">
<?php
if ($the_query->max_num_pages > 1) {
echo paginate_links(array(
'base' => get_pagenum_link(1) . '%_%',
'format' => 'page/%#%/',
'current' => max(1, $paged),
'total' => $the_query->max_num_pages
));
} ?>
</div><?php
wp_reset_postdata();
?>固定ページを用意する
カスタム投稿を一覧表示するのは固定ページなので、テンプレートファイルだけではなく、固定ページ自体も用意します。
他の固定ページと同じように管理画面から新規作成で固定ページを作成します。
スラッグはテンプレートファイルで付けたpage-〇〇.phpの〇〇の部分と同じ文字列にします。
今回はpage-news.phpなのでnewsというスラッグの固定ページを作ります。
内容は無くても大丈夫ですが、タイトルを入れないと保存（公開）できないので、「news一覧ページ」等としておくと良いです。
少し手順は複雑ですが、以上で複数のカスタム投稿を一度に一覧表示出来るようになります。
固定ページを使うところが盲点ですね。
