WordPress に「前(次)の記事へ」リンクボタンを追加する

WordPress の内部リンクを増やし、訪問者の滞在時間を増やしたいと要望があったので、記事ページに「前のページへ」と「次のページへ」のリンクを追加した。

single.php のリンクを追加したい場所に以下を追記する。

1
2
3
4
5
6
7
8
<div style="display:flex;justify-content: space-around; margin-top: 50px;">
<?php if (get_previous_post()):?>
<?php previous_post_link('%link', '<p><img src="'. get_template_directory_uri().'/img/icon-prev.svg" alt="前の記事へ" /></p>'); ?>
<?php endif; ?>
<?php if (get_next_post()):?>
<?php next_post_link('%link', '<p><img src="'. get_template_directory_uri().'/img/icon-next.svg" alt="次の記事へ" /></p>'); ?>
<?php endif; ?>
</div>

前の記事が存在しないのに「前の記事へ」が表示されないように if (get_previouspost() ) で前の記事をチェックし存在する場合にリンクを表示するようにしている。次の記事も同じように処理をしている。

リンク自体は、previous_post_link と next_post_link で生成している。