TITANS氏に詳細プリーズされてしまったので、Autopagerizeの詳細を書きます。前のを書いたときには、もう解説しているサイトがほかにあるからいいじゃんとか思ってたんですが、考えてみれば、解説をしているサイトは多ければ多い方がいいというか多くても何の問題もないわけですね、著作権侵害とかしなければ。というか、多ければそれだけAutopagerizeを導入するサイトが増えるかもしれず、そうなればAutopagerizeを愛用している人間の利益になる、と。そういうことで、書きます。この記事はWebブラウジングを快適にするAutoPagerize やWordPress サイトの AutoPagerize 対応を参照しています。
まずは、ユーザとしてAutopagerizeを導入する方法からいきましょう。AutopagerizeというのはFirefoxのGreasemonkeyというアドオンのために用意されているスクリプトの一つです。Firefoxユーザなら普通に知っていると思いますが、アドオンというのはブラウザの機能を拡張するためのプログラムで、Mozillaのサイトとかから簡単にダウンロードして使うことができます。
んで、Greasemonkeyというのは、ユーザが作ったスクリプトを使って読み込んだページの内容を整形できるFirefox用のアドオンです。ブラウザの機能を拡張するスクリプトを動かすためのブラウザを拡張するアドオンというそういうアレ。AutopagerizeはそのGreasemonkey上で動くスクリプトで、次に読み込むべきページをとってきて、ページの下部にその一部をくっつけることができます。
実際に、どんな感じになるかスクリーンショットで見てみましょう。普通ならば
みたいにページの最後になるとGoooooooooooooooooooooogleみたいなのが表示されるわけですが、Autopagerizeを使うとこんな感じ。
ページのGoooooooooooooogleがくるはずのところに、次のページの内容が読み込まれています。んで、さらにスクロールすると、さらに次のページが読み込まれていくわけですね。
そんな感じでAutopagerizeは非常に便利なので実はFirefox以外のブラウザでも似たようなものが提供されていたりします。この辺は勝手に詳しく調べていただければいいわけですが、SafariとかOperaとかIE7なんかではそのまんまっぽいのがあるみたいですし、IE6などを使っている場合は、SleipnirのSeaHorseというSleipnir版Greasemonkeyみたいな拡張機能にAutopagerizeを移植したものがあります。
で、次はAutopagerizeへの対応方法です。まず、WebサイトのAutopagerizeへの対応法というのは2種類あります。一つ目はsiteinfoとかいうのを書いて読み込み方を指定するもの、もう一つはhtmlにmicroformatsというのを埋め込むというもの。ここではmaicroformatsをhtmlに埋め込む方法を説明したいと思います。まあ、siteinfoをいじるよりも楽というか、直接htmlをいじれるならその方が早いというか。
microformatsとは何じゃいというのはあるんですが、とりあえずhtmlのシンプルな拡張で機械がhtmlを解釈するのを少し楽にするものだと考えればよろしいかと。んで、Autopagerizeに対応するためにすべきことは三つあります。
まず一つ目。link要素rel=nextと書いてhref="次に読み込むURL"とかURLを記述すること。たとえば、今見ているページの次にhttp://bmp69.net/review/no234.htmlを読み込ませたいとすると、こんな感じに記述する。
<link rel="next" href="http://bmp69.net/review/no234.html">
二つ目。繰り返し読み込ませたい要素のclassにautopagerize_page_elementと記述する。たとえば、次のようなHTMLがあったとする。
<h1>たいとるー</h1> <div> <p>文章だー</p> </div> <address>ふったー</address>
んで、<div>を繰り返したい、つまり
<h1>たいとるー</h1> <div> <p>文章だー</p> </div> <div> <p>次のページの文章だー</p> </div> <address>ふったー</address>
みたいな感じでどんどん読み込ませたい場合はこう書きます。
<h1>たいとるー</h1> <div class="autopagerize_page_element"> <p>文章だー</p> </div> <address>ふったー</address>
しかし、<div>をどの要素の前に潜り込ませたいかも指定しなければどこに読み込んでいいのかわかりません。んで、それが三つ目。classにautopagerize_insert_beforeを指定した要素の上に繰り返される要素は突っ込まれます。そのため、上記の例ではさらにこう指定しなければならない。
<h1>たいとるー</h1> <div class="autopagerize_page_element"> <p>文章だー</p> </div> <address class="autopagerize_insert_before">ふったー</address>
三つをあわせるとこんな感じですか。
<html> <head> <link rel="next" href="http://bmp69.net/review/no234.html"> </head> <body> <h1>たいとるー</h1> <div class="autopagerize_page_element"> <p>文章だー</p> </div> <address class="autopagerize_insert_before">ふったー</address> </body> </html>
こんな感じでAutopagerizeへの対応は終了です。まあ、MovableTypeみたいなblogツールを使っている場合は次のページのURLを表示するための簡易タグみたいなのがありますし、class指定についてもテンプレートをいじるだけですべて反映されるので簡単でしょう。めんどくさいのは完全にHTMLだけでWebサイトを作っていたりする場合で、いちいち手動でどのページを次に読み込ませたいか指定し、それぞれのページにclass指定をしなければなりません。うちのサイトは、前回のリニューアルの際にPHP + MySQLを使用したシステムに全面的に移行したので特に問題はありませんでしたが、手動でやらなければならなかったとしたら、とてもやる気は起きなかったでしょうね。
(2008/03/15)
コメント
今回はかなりがんばりました、我ながら。
うちのサイトもFirefoxは
1割ぐらいしかいないですねぇ。
Autopagerizeみたいな機能が
今後一般化してくる可能性はあるかもしれませんね。
RSSとかより普通に便利ですし。
比較するのはかなりおかしいですが。
[bmp_69]
コメントを書き込む
トラックバックURL
http://bmp69.net/blog/trackbacks/32
そして勉強になります。
私もFirefox使いですので「おおー」と思って感心を持ちました。
私のサイト訪問者のFirefoxの割合は１割弱。
はやり８割以上をIE組みが占めています。
でもIE7でもあるんですね。
今後強制的にIE7になっていくので需要の高いモノになっていくかもしれません。
とりあえず日曜日は勉強しよう＾＾；
[TITANS]