投稿とカスタム投稿の表示件数を変更する

2020年7月6日2022年5月22日

WordPressでサイトを制作していると、よくある要件として以下のようにページ毎に投稿の表示件数を変えるといった要件があります。

トップページに新着ニュースを３件表示させる。
ニュース一覧ページでは１０件表示させる。
トップページにニュースとは別で商品（カスタム投稿）を5件表示させる。
商品（カスタム投稿）一覧ページでは８件表示させる。

このコードを毎回書くのが面倒だったので、記事として書いてしまい、自分用のテンプレートとしました。
どうぞコピペして使ってください。

投稿を１０件表示にする

まず最初にやることとしては、一覧ページに表示させる投稿件数の設定します。

管理画面の左メニューより、[設定] → [表示設定]

「最新の投稿」にチェックを入れる
1ページに表示する最大投稿数は「１０投稿」に設定

とりあえず以上の設定だけで一覧ページでの表示件数は１０件にできました。
一覧ページを作っていないのでまだ表示はできませんが、ここについては後ほど実装します。

トップページに新着記事を３件表示

先程1ページに表示する最大投稿数は１０投稿に設定しました。これをトップページでは新着投稿を３件表示させるようにします。

functions.php と front-page.php に以下を記述します。

function news_posts_per_page($query)
{
    if (is_admin() || !$query->is_main_query()) {
        return;
    }
    if ($query->is_front_page()) {
        $query->set('posts_per_page', '3');
    }
}
add_action('pre_get_posts', 'news_posts_per_page');

<?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>      
        <!-- 投稿内容 -->
    <?php endwhile; ?>
<?php endif; ?>

これでトップページは新着投稿を３件表示にできました。

投稿のアーカイブページを作る

投稿にアーカイブ（投稿一覧）をもたせるようにします。

function post_has_archive($args, $post_type)
{
    if ('post' == $post_type) {
        $args['rewrite'] = true;
        $args['has_srchive'] = 'news'; // アーカイブページ名
        $args['label'] = 'ニュース';
    }
    return $args;
}
add_filter('register_post_type_args', 'post_has_archive', 10, 2);

投稿一覧ページへのリンクを作ります。

<a href="<?php echo esc_url(home_url('news')); ?>">ニュース一覧</a>

記載後にパーマリンク設定で「変更を保存」してください。これを行わないと設定が反映されません。

以上まででニュースをトップページではを３件表示させ、一覧ページは１０件させることができました。

商品投稿ページ（カスタム投稿）を作る

現在１つしか投稿タイプはありませんが、追加でもう１つの投稿タイプを作ります。

function create_post_type()
{
    register_post_type('products', [ // 投稿タイプ名
        'labels' => [
            'name'          => '商品', // 管理画面上で表示する投稿タイプ名
            'singular_name' => 'products',    // カスタム投稿の識別名
        ],
        'public'        => true,  // 投稿タイプをpublicにする
        'has_archive'   => true, // アーカイブ機能ON/OFF
        'menu_position' => 5,     // 管理画面上での配置場所
        'show_in_rest'  => true,  //「Gutenberg」を有効にする
    ]);
}
add_action('init', 'create_post_type');

ここも記載後にパーマリンク設定で「変更を保存」してください。

これで管理画面にニュースと商品の投稿タイプができ、２つ別々の投稿が作れるようになりました。

トップページに商品（カスタム投稿）を５件表示

トップページでは商品（カスタム投稿）を５件表示させるようにします。

<?php
$args = [
    'post_type' => 'products',
    'posts_per_page' => 5,
    'paged' => $paged
];
$the_query = new WP_Query($args);
?>
<?php if ($the_query->have_posts()) : ?>
    <?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
　　　　<!-- 投稿内容 -->
    <?php endwhile; ?>
    <?php wp_reset_postdata(); ?>
<?php endif; ?>

商品一覧ページヘのリンクをつくる。

<a href="<?php echo esc_url(home_url('products')); ?>">商品一覧</a>

注意点として、上記にアクセスして表示されるテンプレートはarchive.phpになります。

このままではニュース一覧ページもarchive.phpが出力され、商品一覧ページもarchive.phpが出力されてしまいます。
ページによってレイアウトを変えたい場合は、ニュース一覧ページのファイル名をarchive-news.phpにしたり、商品一覧ページはarchive-products.phpにするなど、スラッグをファイル名にすればそれぞれ違ったファイルで出力することができます。

以上、ページによって投稿の表示件数を変更する方法でした。