Learning site for website creation

p06-4:カスタム投稿一覧表示専用テンプレート「Custom Post Type UI」

  • 投稿日:2018年11月17日
  • 更新日:2018年11月21日

「Custom Post Type UI」を使って作成したカスタム投稿の一覧ページを表示します。

http://WordPressフォルダへのパス/カスタム投稿の投稿タイプスラッグ/

今回は「http://localhost/lesson1/post_news/」でカスタム投稿一覧が表示されます。

また表示に使われているテンプレートは「archive.php」を使用しています。

カスタム投稿一覧表示専用テンプレート作成

一覧表示用テンプレートは以下のようになっています。

優先度(高い ← → 低い)

archive-投稿タイプ.php

archive.php

index.php

今回作成したカスタム投稿の投稿タイプスラッグが「post_news」なので「archive-post_news.php」でカスタム投稿一覧表示用テンプレートを作成します。

archive-post_news.php

<?php get_header(); ?>

<div class="main-loop">
  <div class="inner">

<?php // カスタム投稿アーカイブタイトル表示 ?>
<?php
// 検索結果の記事数
$found_posts = $wp_query->found_posts;
?>
<h1>お知らせの一覧:<?php echo $found_posts;?>件</h1>

<?php /***** メインループ開始 *****/ ?>
<?php if (have_posts()) :?>
<?php while (have_posts()) : the_post(); ?>
<?php $id = get_the_ID(); ?>
<?php // テンプレートパーツ読み込み:一覧 ?>
<?php get_template_part('content'); ?>
<?php endwhile; ?>
<?php else: ?>
<?php // テンプレートパーツ読み込み:記事なし ?>
<?php get_template_part('content','none'); ?>
<?php endif; ?>
<?php /***** メインループ終了 *****/ ?>

<?php // ページネーション ?>
<?php if (pagination()) : ?>
<div class="pagination"><?php echo pagination(); ?></div>
<?php endif; ?>

        </div><!-- /.inner -->
      </div><!-- /.main-loop -->
    </div><!-- /.main -->
    <?php get_sidebar(); ?>
  </div><!-- /.content -->

<?php
get_footer();

カスタム投稿一覧表示用テンプレート作成後に再度「http://localhost/lesson1/post_news/」にアクセスすると「archive-post_news.php」を使って表示していることを確認できます。