久々に自分のブログをいじってみた。

ふと過去の記事を漁る事があって、「このくらいの時期に書いた気がするけど・・」と記事を見ていたら

俺のブログって、次の記事へのリンクがないな・・

と言う事に気づいた。
ま、自分のブログだと続けて自分の記事を読む事がないんで、気づかなかったワケだ。
アクセサビリティ的にもあった方がよかろう。と、言うわけで作ってみた。

リンクを追加するだけだし、一般的な機能なんで、当然簡単に追加できるだろう。と、
google先生に聞いてみたところ、やっぱり簡単に実装できるらしい。
使用したタグは以下の二つ。

previous_post_link
next_post_link

今回は「個別ページに前の記事、次の記事のリンクを追加する」と言うだけなので、
上記のタグをsingle.phpに追加。

<div class="navi-pre-next">
  <div class="previousLink"><?php previous_post_link() ?></div>
  <div class="nextLink"><?php next_post_link() ?></div>
</div>

これだけでも十分なんだが、この状態だと前の記事のタイトルがリンクとして表示される。
タイトルがあんまり長いと、レイアウトが崩れるので固定文字列に変更してみる。

<div class="navi-pre-next">
  <div class="previousLink"><?php previous_post_link('%link','<< 前の記事') ?></div>
  <div class="nextLink"><?php next_post_link('%link','次の記事 >>') ?></div>
</div>

後はスタイルシートでちょちょいとレイアウトを調整して終了。

Tweet