WordPress で現在の記事の前後の記事を取得し、「次の記事へ」「前の記事へ」ボタンを出力する方法です。
コード
前後の記事を取得
前後記事の取得には、get_previous_post()
とget_next_post()
を使います。下記のような前後記事の配列データを作ってみます。
$adjacent_data = [
'prev' => [
'name' => '前の記事へ',
'post' => get_previous_post()
],
'next' => [
'name' => '次の記事へ',
'post' => get_next_post(),
],
];
- adjacent は「隣接する」という意味合いです。
name
にはボタンのテキストを入れておきましょう。
WordPress にはget_adjacent_post()
という「前後の指定した方の記事を取得する」関数もありますが、get_next_post()
等は、その関数を内部で呼び出しています。
前後の記事を出力
先程つくった配列$adjacent_data
を元に、ループで出力させてみましょう。
<?php foreach ($adjacent_data as $key => $data): if ($data['post']): ?>
<a class="btn btn--<?= $key ?>" href="<?= get_permalink($data['post']) ?>"><?= $data['name'] ?></a>
<?php endif; endforeach; ?>
もし記事名を出力させたいなら、$data['post']
に入れておいたWP_Post
オブジェクトから出力しましょう。
<?= $data['name'] ?>
↓
<?= $data['post']->post_title ?>
実際の表示
<a class="btn btn--prev" href="...">前の記事へ</a>
<a class="btn btn--next" href="...">次の記事へ</a>
class にnext
かprev
を出すようにしているので、スタイリングも前後で分けることができます。そのあたりはうまいことカスタマイズしてみてください。