DynamicMTMLをつかってページ分割をしてみる
みなさん、こんにちは、まーしーです。
Wimbledonはフェデラーの優勝でしたね。マレーは残念でした。。。
今月末にはオリンピックがありますが、そこでは誰が優勝するんでしょうね??
さて、先日の勉強会で、DynamicMTMLを使ったページ分割の話を少し聞いたので、試しに作ってみました。
表示例
全件
まず、全件というか20件を表示させた状態がこんな感じです。
とりあえず3件ずつに分けてみます。
1ページ目
2ページ目
20件のエントリーを3つずつなので7ページになってますね。
テンプレート
ではテンプレートを考えていきます。
(DynamicMTMLがインストールされてる必要があります)
もうすこし上手い方法がありそうなきがしますが、全体はこんなかんじでしょうか。
全体のテンプレート
<MTDynamicMTML> <mt:SetVarBlock name="page"><MTQuery key="page" escape="html"></mt:SetVarBlock> <mt:If name="page" eq=""><mt:SetVar name="page" value="1"></mt:If> <mt:SetVar name="limit" value="3"> <mt:SetVarBlock name="offset"><mt:SetVar name="page" op="-" value="1"><mt:GetVar name="page" op="*" value="$limit"></mt:SetVarBlock> <mt:Entries limit="$limit" offset="$offset"><MTEntriesHeader><h2>page分割</h2><ul></MTEntriesHeader> <li><mt:EntryTitle></li> <MTEntriesFooter></ul></MTEntriesFooter></mt:Entries> <mt:SetVar name="total" value="20"> <mt:SetVarBlock name="pager"><mt:GetVar name="total" op="/" value="$limit"></mt:SetVarBlock> <mt:SetVarBlock name="pager2"><mt:GetVar name="total" op="%" value="$limit"></mt:SetVarBlock> <mt:If name="pager2" ne="0"><mt:SetVar name="pager" op="++"></mt:If> <p><a href="./test.html">1</a><mt:for from="1" to="$pager"><mt:Unless name="__first__"> | <a href="./test.html?page=<mt:GetVar name="__counter__">"><mt:GetVar name="__counter__"></a></mt:Unless></mt:for></p> </MTDynamicMTML>
全体を<MTDynamicMTML>でくくっておきます。
次に表示させるための計算をしていきます。
page数の取得と1ページ当たりの表示数を指定する
今回は「test.html?page=2」といったかんじで、pageのパラメータの値で何ページ目かを指定します。
<mt:SetVarBlock name="page"><MTQuery key="page" escape="html"></mt:SetVarBlock> <mt:If name="page" eq=""><mt:SetVar name="page" value="1"></mt:If> <mt:SetVar name="limit" value="3"> <mt:SetVarBlock name="offset"><mt:SetVar name="page" op="-" value="1"><mt:GetVar name="page" op="*" value="$limit"></mt:SetVarBlock>
まず、MTQueryでpageの値を受け取って、変数pageに入れます。
1ページ目は「test.html」となっている可能性があるので、このMTQueryで値をとれない場合は1ページ目なので、pageが空の場合1をセットします。
(ここは他の条件が色々ありそうです。数字以外が入ったときとか予想外の数字がはいるとか。。。)
あと、limitに1ページあたりの表示件数を指定します。
1ページ目は1〜3番目が表示されます。2ページ目は3つ分が表示されず、4〜6番目が表示されます。
なのでpageの値から1を引いて1ページ当たりの表示件数をかけたものがoffsetされます。
この値を変数offsetに入れておきます。
指定した件数毎に表示させる
実際に表示させる部分を見てみます。
<mt:Entries limit="$limit" offset="$offset"><MTEntriesHeader><h2>page分割</h2><ul></MTEntriesHeader> <li><mt:EntryTitle></li> <MTEntriesFooter></ul></MTEntriesFooter></mt:Entries>
mt:Entriesのlimitモディファイアにlimitの値を。offsetモディファイアにoffsetの値をセットします。
これだけでいいのでMTQueryの力は偉大ですね。。。
ページリンク部分の表示
次に、各ページへのリンク部分を見ていきます。
<mt:SetVar name="total" value="20"> <mt:SetVarBlock name="pager"><mt:GetVar name="total" op="/" value="$limit"></mt:SetVarBlock> <mt:SetVarBlock name="pager2"><mt:GetVar name="total" op="%" value="$limit"></mt:SetVarBlock> <mt:If name="pager2" ne="0"><mt:SetVar name="pager" op="++"></mt:If> <p><a href="./test.html">1</a><mt:for from="1" to="$pager"><mt:Unless name="__first__"> | <a href="./test.html?page=<mt:GetVar name="__counter__">"><mt:GetVar name="__counter__"></a></mt:Unless></mt:for></p>
ひとまず、20件の中から表示するので、変数totalに20をセットします。
実際に使う場合は<$MTBlogEntryCount$>の値などを使う感じになるでしょう。
変数totalの値を1ページ当たりの件数で割って総頁数を出します。ひとまずpagerにセットしておきます。
totalをlimitで割って割り切れればそのまま頁数となるのですが、割り切れない場合もあります。
変数pager2にひとまず剰余をセットしておきます。pager2が0じゃないときはもう1ページ余計にあることになるので、pagerに1を足しておきます。
それらが揃ったところで、各ページへのリンクを表示させます。
1ページ目は必ず表示させる事にしておきます。2ページ目からの表示をmt:forを使って考えます。
mt:forでは1ページ目から変数pagerに入ってる頁数分繰り返します。
ただ、1ページ目は表示させているので、__first__以外ということでセットしています。
forのなかでの繰り返し分については__counter__で取得出来るので「?page=」 の部分やリンクテキストの部分に使用しています。
ここはfromを2からにしてpagerの値が2以上の時のみ、みたいな判定の方がいいのかもしれないです
ということでザックリこんなかんじで作ってみたのですが、まだ相当無駄がありそうです。
(あとは考えられる条件の漏れとか)
リンクを作る部分とかもっとスマートに計算できそうな気がします。
スタティックにページ分割させてもいいですが、こんな形で動的にページ分割させるのも良さそうですね。
DynamicMTMLはまだまだ奥が深そうです。。。