Autopagerizeという、次のページを読み込んで遷移無しで閲覧していく
凄いスクリプトがあるんですが。
それに自分のサイトを対応させてみようじゃないかと思って調べてみたところ、
まぁなんというかいともあっさり出来てしまったのでメモしておきます。


Autopagerizeについては、言葉で簡潔に説明するのは難しいので…
このあたりを読んでください。

AutoPagerize(Greasemonkey) / AutoPagerize for SeaHorse(Seahorse)でさくさく閲覧。

必要なこと。

HTMLの中にAutopagerize用のコードを挿入してやる必要があります。
ブログであれば、テンプレートを改変する、と言うことになります。

設定はいくつかあるようですが一番シンプルなのは以下の3つを挿入してやること。

  • rel="next"
  • class="autopagerize_page_element"
  • class="autopagerize_insert_before"

『rel="next"』は、次に読み込むページを指定してやるのに必要です。
一般的には「次のページ」とか「次へ」とかそんな感じのリンクがあるんじゃないでしょうか。



そのaタグに『rel="next"』を追加してやればOKです。


<a href="/next_page.html">次のページ</a>



<a href="/next_page.html" rel="next">次のページ</a>


『autopagerize_page_element』は実際に表示する要素。
ブログだったら本文とかタイトルとかになるかと。
その要素にclassとして、『autopagerize_page_element』を追加してやればOK。


『autopagerize_insert_before』は表示する要素を挿入する場所です。
コレがclassとして設定された場所の直前に挿入されます。



図解するとこんな感じです。

タグ設定後のページはたとえばこんな感じになっていると思います。




ページの下まで表示すると次のページが読み込まれて…



元々の文章の下に、次の文章が挿入されます。


考えてみればものすごいシンプルなんですが、コレできっちり動くから不思議。

コメント欄をどうするかとか、アフリエイトはとか考えると、
ページの構造によっては少々面倒なことになるかと思いますが、
そのあたりも設定できるようになっています。

個々に上手く調整してくださいまし。
(なお、rel="prev"などは省略しました。とりあえずAutopagerizeってことで…)


参考エントリ

naoKの「ホイきたー!」 : ppBlogのAutoPagerize対応方法




あ、ちなみに

このブログ自体はAutopagerizeには対応してません。
再構築が面倒…ということじゃなくて、なんとなく乗り気じゃないっていうか、そんなので。
一つのエントリに用がある個人ブログの場合別に必要ないんじゃないかなーとね。
あと、フッターにあるプロフィールとかカテゴリメニューとか使えなくなるし。

ニュースサイトとかカタログとか検索エンジンとかDBとかだと便利だけどね。
そういう意味で言うと、個別エントリには付けないつもりだけど、
月毎のアーカイブとかにはそのうち付けるかもしれません。
(その前に月毎のアーカイブのデザインをやり直したいんだけどね…ちょっと微妙すぎ)