【メモ】 AutoPagerで同じ要素が重複してロードされる場合(Tumblrで確認)

AutoPagerをFirefoxに入れて自分のTumblrを見ると、次のように繋がって見えてしまいます。




少しわかりにくいかも知れませんが、1ページ当たり5枚の写真が表示されていて、それが継ぎ足されていくというロードです。んで、よく見ると2ページ目のコンテンツ(薄くオレンジ色を配した部分)が2回繰り返して表示されているのがわかります。これがとても不便でした。

多分僕の書いたカスタムHTMLが他のtumblogに比べて特殊で、ルールが一致しないと言うことなんだと思うのですが、だったらどうしたら良いんだよと言うのがよくわからない。

…はい、AutoPagerのルールを読みましょう。



ルールによると、コンテンツを指定するXPathはこんな感じに。

//div[@id = "container" or @id = "content" or @class = "main" or count(child::div) >= 10 or count(child::div[contains(@class, "post")]) >= 5]

日本語で書くと、

次のいずれかのルールに一致するものをコンテンツとして繰り返す。
  • idがcontainerのDIV要素
  • idがcontentのDIV要素
  • クラスがmainのDIV要素
  • 子要素にDIV要素を10個以上持つDIV要素
  • postクラスのDIV要素を5個以上持つDIV要素

カスタムHTMLがある以上、コンテンツとするパターンを幅広く取っておくのは大事なことだと思うのですけど、それはともかくとして、どうやら複数のルールに合致した場合それぞれをコンテンツとして認識して、複数回継ぎ足すようなのです。えー。


僕の書いたHTMLの場合、

  • idがcontainerのDIV要素
  • postクラスのDIV要素を5個以上持つDIV要素

この辺りが重複するらしく、たとえば、

  • containerのidを「containerz」に変更してみる
  • 1ページ当たりのpost数を5未満にしてみる
  • ルールから「idがcontainerのDIV要素」を排除する

などとすると継ぎ足しに問題が起きなくなります。


そろそろ飽きてきたのでカスタムHTMLを変更しても良かったんですが、うち以外のTumblogでも影響が出ているのが見えたのでとりあえずはAutoPagerのルールを変更することに。該当のルールを「複製して編集」し、コンテンツXPathを以下のように変更しました。

//div[@class = "main" or count(child::div) >= 10 or count(child::div[contains(@class, "post")]) >= 5]

「idがcontainerのDIV要素」「idがcontentのDIV要素」と言う条件を削除。


うん、これで問題起きなくなった。
もしお困りの方がいましたらお試しを。