WordPress のカスタム投稿タイプの一覧ページ作成と指定したページ順に並び替えるカスタマイズ

h2ham

6年前

一覧ページのテンプレート

まずは、一覧ページのテンプレートは、専用を用意したいと考えたため、 archive-xxx.php を作成しました。

xxx はカスタム投稿タイプのスラッグを指定することで、そのスラッグの一覧ページのテンプレートが利用できます。今回は books というスラッグで作成したため、 archive-books.php で用意しました。

一覧が表示されるように register_post_type をカスタマイズ

一覧ページに表示されるには、 has_archive を有効にしておく必要があるため、追加します。

また、パーマリンクも一覧では /books 、詳細は /books/投稿スラッグ で表示されるようにしたいので、 rewrite の指定も追加。

add_action( 'init', 'add_custom' );
function create_post_type() {
  register_post_type( 'books',
    array(
      'label' => '書籍登録',
      'show_ui' => true,
      'publicly_queryable' => true,
      'has_archive' => true,
      'rewrite' => array(
        'slug' => 'books', 
        'with_front' => false
      ),
      'supports' => array('title', 'editor', 'custom-fields', 'markdown-osi')
    )
  );
}

指定順に並び替えられるように順序を指定

入力した順序で並び替えができるように、管理画面の一覧に表示される Post Order: に、数値を入力します。毎回入力し直す必要が内容に、最新は数値が大きいものが表示されるように入力しておきます。

投稿ページにも指定順の入力欄を追加

我らがコモモ先生が以前エントリーしていた内容を参考にしてみました。

カスタム投稿タイプを固定ページとして利用する | Cat Speak

page-attributes
supportsに、「page-attributes」を追加すると、管理画面から新規追加した際に、「属性」が表示され、「ページ順序」が利用できるようになります。

引用元：カスタム投稿タイプを固定ページとして利用する | Cat Speak

ということで、 supports に追加

add_action( 'init', 'add_custom' );
function create_post_type() {
  register_post_type( 'books',
    array(
      'label' => '書籍登録',
      'show_ui' => true,
      'publicly_queryable' => true,
      'has_archive' => true,
      'rewrite' => array(
        'slug' => 'books', 
        'with_front' => false
      ),
      'supports' => array('title', 'editor', 'custom-fields', 'page-attributes', 'markdown-osi')
    )
  );
}

テンプレート側の指定

テンプレート側は、最新の30件だけ表示されるようにしようかと思ったので、下記のように指定してみました。尚、あとで増えたらページャー機能も・・・と考えたのですが、一覧では最新のみでいいかなと。

<?php
$books_archive_post_args = array(
  'post_type' => 'books',
  'orderby' => 'menu_order',
  'order' => 'DESC',
  'posts_per_page' => 30
);
$books_archive_post = get_posts( $books_archive_post_args );
foreach ( $books_archive_post as $post ) : setup_postdata( $post );
?>
〜 HTML省略 〜
<?php endforeach; wp_reset_postdata(); ?>

orderby で並び替えの指定

指定順が反映されるように、 orderby で menu_order を指定、降順に表示されるように 'order' => 'DESC' としました。

これでとりあえず、おすすめ書籍ページが完成しました。

おすすめ書籍 - HAM MEDIA MEMO

参照：