今まであまり気にしたことがなかったというか、ブログはそういうものなんだと勝手に思っていたのが、「前のページ」「次のページ」と「前の記事」と「次の記事」の関係。
- ブログ的には
- 「次のページ」=「古い記事」
- 「前のページ」=「新しい記事」
- 個人的には
- 「次のページ」=「新しい記事」
- 「前のページ」=「古い記事」
個人的には、「前」は過去のこと、「次」は未来のことだと思っていますが、ブログは逆。
よくよく考えると、どっちがどっちだっけと、わけがわからなくなって、混乱してしまう。
そんなわけで、トップページやカテゴリー、月別アーカイブのページャ(前後の記事へのリンク)の「次のページ」と「前のページ」のリンクをCSSで逆(反対)に表示してみることにしました。
※ 個別記事のページャが記事のタイトルではなく「次のページ」と「前のページ」になってしまいます...。
(デザイン→カスタマイズ→「デザインCSS」にコードを入力)
CSS
.pager {
font-size: 0;
}
.pager-prev a:before {
font-size: 15px;
content: "次のページ";
}
.pager-next a:after {
font-size: 15px;
content: "前のページ";
}
リンクテキスト(「前のページ」、「次のページ」、個別記事のページャの記事タイトル)の文字列を「font-size: 0」で見えなくして、前のページのリンク(の前)に「次のページ」、次のページのリンク(の後)に「前のページ」という文字列を挿入してそれぞれ表示します。
参考になるブログ・Webサイト
Qiita - CSSでテキストを書き換える方法
16bit! - 「次の記事」は新しい記事のことだけど、「次のページ」は古い記事のこと
ウェブ企画パートナーズ - ブログの「前へ」「次へ」ボタンは左右どちらか過去・未来?
- 追記 -
はてなブログのトップページに「前のページ」リンクを設置した
はてなブログの個別記事以外にページャの矢印をつけたい