PowerSearchのEstraier検索結果で3点リーダー省略機能の付いたページャーを設ける

投稿日: 更新日:

毎回同じ面倒を繰り返してるように見えるのでメモ。

PowerSearchの検索結果画面にて、次のような3点リーダーで途中のページを省略するタイプのページャーをやるとする。

<< 1...4 5 [6] 7 8 ...12 >>

標準のCMSテンプレートタグにこれを簡単にやるような機能は無い。

なので、次のようなロジックを組む必要がある。

<mt:EstraierMeta>
  <mt:SetVarBlock name="search_params">/search/?blog_id=<$mt:BlogID encode_html="1"$>&limit=<$mt:Var name="__limit__" encode_html="1"$>&query=<$mt:Var name="__query__" encode_html="1" encode_url="1"$><mt:EstraierTarget>&target=<$mt:Var name="__target__" encode_html="1"$></mt:EstraierTarget><mt:EstraierSuffix>&suffix=<$mt:Var name="__suffix__" encode_html="1"$></mt:EstraierSuffix>&offset=</mt:SetVarBlock>
</mt:EstraierMeta>

<MTEstraierBlock includeblogs="10" query="$__query__" limit="$__limit__" offset="$__offset__">
  <mt:IfEstResultMatch>
...
    <mt:EstResultFooter>

        <mt:setvar name="num__display_range" value="2" />
        <mt:setvar name="flag__exist_l_leader" value="0" />
        <mt:setvar name="flag__exist_r_leader" value="0" />
        <mt:EstResultPager>
          <mt:if name="__current__">
            <mt:var name="__counter__" setvar="num__current_page" />
          </mt:if>
        </mt:EstResultPager>

        <mt:EstResultPager>

          <mt:var name="flag__is_pager_start_item" value="0" />
          <mt:var name="flag__is_pager_end_item" value="0" />
          <MTEstResultPagerHeader>
            <mt:var name="flag__is_pager_start_item" value="1" />
          </MTEstResultPagerHeader>
          <MTEstResultPagerFooter>
            <mt:var name="flag__is_pager_end_item" value="1" />
          </MTEstResultPagerFooter>

          <MTEstResultPagerHeader>
            <ul class="pagination">
            <mt:IfEstResultPrev>
              <li class="prev"><a href="<$mt:Var name='search_params'$><$mt:Var name='__prevoffset__'$>"><span>«</span></a></li>
            </mt:IfEstResultPrev>
          </MTEstResultPagerHeader>

          <mt:var name="flag__show_pager_item" value="0" />
          <mt:if name="flag__is_pager_start_item" eq="1">
            <mt:var name="flag__show_pager_item" value="1" />
          <mt:elseif name="flag__is_pager_end_item" eq="1">
            <mt:var name="flag__show_pager_item" value="1" />
          <mt:elseif name="__counter__" eq="$num__current_page">
            <mt:var name="flag__show_pager_item" value="1" />
          <mt:elseif name="__counter__" gt="$num__current_page">
            <mt:ignore>ループのフォーカス(=__counter__)がカレントページから2個以上右に離れてる時は、3点リーダーにする。</mt:ignore>
            <mt:var name="num__current_page" op="+" value="$num__display_range" setvar="num__threshold" />
            <mt:if name="num__threshold" ge="$__counter__" >
              <mt:var name="flag__show_pager_item" value="1" />
            <mt:else>
              <mt:setvar name="switch__set_leader" value="left" />
            </mt:if>
          <mt:elseif name="__counter__" lt="$num__current_page">
            <mt:ignore>ループのフォーカス(=__counter__)がカレントページから2個以上左に離れてる時は、3点リーダーにする。</mt:ignore>
            <mt:var name="num__current_page" op="-" value="$num__display_range" setvar="num__threshold" />
            <mt:if name="__counter__" ge="$num__threshold" >
              <mt:var name="flag__show_pager_item" value="1" />
            <mt:else>
              <mt:setvar name="switch__set_leader" value="right" />
            </mt:if>
          </mt:if>

          <mt:if name="flag__show_pager_item" eq="1">
            <mt:if name="__current__">
              <li><a href="#" class="active"><span><mt:var name="__counter__" /></span></a></li>
            <mt:else>
                <li><a href="<$mt:var name="search_params"$><mt:var name="__offset__">"><span><mt:var name="__counter__" /></span></a></li>
            </mt:if>
          <mt:elseif name="switch__set_leader" eq="left">
            <mt:if name="flag__exist_l_leader" ne="1">
              <li><a href="#">...</a></li>
              <mt:setvar name="flag__exist_l_leader" value="1" />
            </mt:if>
          <mt:elseif name="switch__set_leader" eq="right">
            <mt:if name="flag__exist_r_leader" ne="1">
              <li><a href="#">...</a></li>
              <mt:setvar name="flag__exist_r_leader" value="1" />
            </mt:if>
          </mt:if>

          <MTEstResultPagerFooter>
            <mt:IfEstResultNext>
              <li class="next"><a href="<$mt:Var name='search_params'$><$mt:Var name='__nextoffset__'$>"><span>»</span></a></li>
            </mt:IfEstResultNext>
            </ul>
          </MTEstResultPagerFooter>
        </mt:EstResultPager>

    </mt:EstResultFooter>
  <mt:Else>
    <p>「<$mt:var name='search_keyword'$>」と一致する結果は見つかりませんでした。</p>
  </mt:IfEstResultMatch>
</MTEstraierBlock>

num__display_range は、ページャーのフォーカスが当たってるページの前後何ページを、ページャー上のリンクとして表示するか、を指定する。

num__current_page はフォーカスの当たっているページ番号を取得する。
mt-search.cgiのようにMTCurrentPageのようなタグで一発取得出来ないので、EstResultPagerの予約変数__current__を使って取得する。

あーーーーめんどい!!

関連するタグ

PowerCMS5.16, PowerSearch