BLOGブログ
2025/06/03
WordPressのsingle.phpで「同一カテゴリー内」の前後記事ページャーを実装する方法
WordPressの投稿詳細ページ(single.php
)で、記事の前後リンクを表示する場合、デフォルトでは全投稿からの前後が対象になります。
しかし、「同じカテゴリー内で前後の記事に遷移させたい」というケースは多いですよね。
当社では、ある案件で予算の都合上、お知らせ・事例・セミナー情報などすべての更新情報を投稿からカテゴリー分けで投稿する形をとったときに、シングルページのページャーを同じカテゴリー内で前後の記事に遷移させるようにしました。
実装サンプルコード(カテゴリー限定)
以下のコードを、single.php
の該当箇所に設置すればOKです。
<style>
.pager {
display: flex;
justify-content: space-between;
list-style: none;
padding: 0;
}
.pager li a {
text-decoration: none;
color: #333;
padding: 5px 10px;
border: 1px solid #ccc;
border-radius: 5px;
}
</style>
<ul class="pager">
<?php if (get_previous_post(true)): ?>
<li class="previous">
<?php previous_post_link('%link', '≪ %title', true); ?>
</li>
<?php endif; ?>
<?php if (get_next_post(true)): ?>
<li class="next">
<?php next_post_link('%link', '%title ≫', true); ?>
</li>
<?php endif; ?>
</ul>
get_previous_post(true)
やget_next_post(true)
によって、「同一カテゴリ内の前後記事」が存在するかをチェック。previous_post_link('%link', '≪ %title', true);
のtrue
が「同じカテゴリー内のみ」を指定するキー。- HTMLはシンプルな
ul.pager
を使ってナビゲーション形式に。
まとめ
single.php
において、同じカテゴリー内の記事だけを前後にナビゲートするページャーは、実はとても簡単に実装できます。
ポイントは、previous_post_link()
や next_post_link()
に 第3引数として true
を渡すだけ。たったこれだけで、ユーザーにとってより自然で使いやすい閲覧体験を提供できます。
カテゴリ単位のストーリー性や連続性を保ちたいサイトでは特に有効です。ぜひ、あなたのWordPressサイトにも取り入れてみてください。
CONTACTお問い合わせ
サービスに関するお問い合わせやお見積もり・ご相談などお気軽にご相談ください。