PowerCMS ブログ

ホーム > PowerCMS ブログ > テンプレート作成Tips > 静的ページ分割機能のページ送りナビゲーションをカスタマイズする (実践編)

以前の記事『静的ページ分割(Pager機能)のページ送りナビゲーションをカスタマイズする』に続き、PowerCMS が提供する静的なアーカイブのページ分割機能 (Pager) で利用できる、ページ送りナビゲーションのカスタマイズ例について紹介します。

ここでは現在のページの前後数ページ分と、始まりと終わりの数ページ分についてリンクし、それらの範囲外を省略表示するページ送りナビゲーションの例を紹介します。

まず次のテンプレートをコピーして、MTEntriesHeader や MTEntriesFooter ブロックタグの中など必要な箇所に貼り付けます。

<MTPager strip_emptylines="1">
  <MTIfPagerHeader>
    <$MTPagerCurrent setvar="_pager_current"$>
    <$MTPagerTotal setvar="_pager_total"$>
    <$MTSetVar name="_pager_fraction" value=""$>
    <MTUnless name="pager_strip_index" ne="0">
      <MTSetVarBlock name="_pager_strip_idx_regex"
        >/\/<$MTIndexBasename extension="1" replace=".","\."$>(#.*)?\z/</MTSetVarBlock>
    </MTUnless>
    <$MTSetVar name="_pager_i" value="0"$>
    <MTLoop name="pager_range">
      <MTIf name="__first__">
        <$MTVar name="count(pager_range)" setvar="_pager_i"$>
        <MTIf name="_pager_i" lt="2">
          <$MTSetVar name="_pager_i" value="0"$>
        </MTIf>
      </MTIf>
      <MTIf name="__counter__" le="2">
        <MTUnless name="__value__" like='/\A(?:0|[1-9]\d*)\z/'>
          <$MTSetVar name="_pager_i" value="0"$>
        </MTUnless>
      </MTIf>
      <MTIf name="__last__">
        <MTIf name="_pager_i">
          <$MTVar name="pager_range[0]" setvar="_pager_i"$>
          <$MTVar name="_pager_current" op="-" value="$_pager_i" setvar="_pager_range_start"$>
          <$MTVar name="_pager_total" op="-" value="$_pager_i" setvar="_pager_end_before"$>
          <$MTVar name="pager_range[1]" setvar="_pager_i"$>
          <$MTVar name="_pager_current" op="+" value="$_pager_i" setvar="_pager_range_stop"$>
          <$MTVar name="_pager_i" op="++" setvar="_pager_begin_after"$>
          <$MTVar name="pager_range[2]" setvar="_pager_fraction"$>
          <$MTSetVar name="_pager_i" value="1"$>
        </MTIf>
      </MTIf>
    </MTLoop>
    <MTUnless name="_pager_i">
      <$MTVar name="pager_range" _default="5" setvar="_pager_i"$>
      <MTIf name="_pager_i" like='/\A-?[1-9]\d*\z/'>
        <MTIf name="_pager_i" gt="0">
          <$MTSetVar name="_pager_i" op="--"$>
          <$MTVar name="_pager_i" op="/" value="2" regex_replace='/\..*/','' setvar="_pager_j"$>
          <$MTVar name="_pager_current" op="-" value="$_pager_j" setvar="_pager_range_start"$>
          <$MTVar name="_pager_total" op="-" value="$_pager_j" setvar="_pager_end_before"$>
          <MTIf name="_pager_i" op="%" value="2">
            <$MTSetVar name="_pager_j" op="++"$>
          </MTIf>
          <$MTVar name="_pager_current" op="+" value="$_pager_j" setvar="_pager_range_stop"$>
          <$MTVar name="_pager_j" op="++" setvar="_pager_begin_after"$>
        <MTElse lt="0">
          <$MTSetVar name="_pager_fraction" value="/"$>
        </MTIf>
      <MTElse>
        <$MTSetVar name="_pager_fraction" value="$_pager_i"$>
      </MTIf>
    </MTUnless>
<ul class="<$MTVar name="pager_classname" _default="pager"$>">
    <$MTSetVar name="_pager_show_first" value="0"$>
    <MTUnless name="pager_show_first" eq="0">
      <MTUnless name="pager_show_first" eq="2">
        <$MTSetVar name="_pager_show_first" value="1"$>
      <MTElse>
        <MTIfPagerPrev>
          <$MTSetVar name="_pager_show_first" value="2"$>
        </MTIfPagerPrev>
      </MTUnless>
    </MTUnless>
    <MTIf name="_pager_show_first">
  <li class="<$MTVar name="pager_first_classname" _default="first"$>"><MTIfPagerPrev
      ><a href="<$MTPagerLink regex_replace="$_pager_strip_idx_regex","/$1"$>"><MTElse><span></MTIfPagerPrev
        ><$MTVar name="pager_first_label" _default="最初" escape="html"$><MTIfPagerPrev
          ></a><MTElse></span></MTIfPagerPrev></li>
    </MTIf>
    <$MTSetVar name="_pager_show_prev" value="0"$>
    <MTUnless name="pager_show_prev" eq="0">
      <MTUnless name="pager_show_prev" eq="2">
        <$MTSetVar name="_pager_show_prev" value="1"$>
      <MTElse>
        <MTIfPagerPrev>
          <$MTSetVar name="_pager_show_prev" value="2"$>
        </MTIfPagerPrev>
      </MTUnless>
    </MTUnless>
    <MTIf name="_pager_show_prev">
  <li class="<$MTVar name="pager_prev_classname" _default="prev"$>"><MTIfPagerPrev
      ><a href="<$MTPagerPrevLink regex_replace="$_pager_strip_idx_regex","/$1"$>"><MTElse><span></MTIfPagerPrev
        ><$MTVar name="pager_prev_label" _default="前" escape="html"$><MTIfPagerPrev
          ></a><MTElse></span></MTIfPagerPrev></li>
    </MTIf>
    <MTIf name="_pager_fraction">
  <li class="<$MTVar name="pager_fraction_classname" _default="fraction index"
      $>"><span><$MTVar name="_pager_current"
        $><$MTVar name="_pager_fraction" escape="html"$><$MTVar name="_pager_total"$></span></li>
    </MTIf>
  </MTIfPagerHeader>
  <MTUnless name="_pager_fraction">
    <$MTPagerCounter setvar="_pager_counter"$>
    <$MTSetVar name="_pager_in_range" value="0"$>
    <$MTSetVar name="_pager_ellipsis" value="0"$>
    <MTIf name="_pager_counter" le="$_pager_begin_after">
      <$MTSetVar name="_pager_in_range" value="3"$>
    <MTElse gt="$_pager_end_before">
      <$MTSetVar name="_pager_in_range" value="4"$>
    <MTElse eq="$_pager_end_before">
      <$MTSetVar name="_pager_in_range" value="5"$>
      <MTIf name="_pager_counter" op="-" value="1" gt="$_pager_range_stop">
        <$MTSetVar name="_pager_ellipsis" value="1"$>
      <MTElse le="$_pager_range_start">
        <MTIf name="_pager_counter" gt="$_pager_begin_after">
          <$MTSetVar name="_pager_ellipsis" value="2"$>
        </MTIf>
      </MTIf>
    <MTElse ge="$_pager_range_start">
      <MTIf name="_pager_counter" eq="$_pager_range_start">
        <MTIf name="_pager_counter" op="-" value="1" ne="$_pager_begin_after">
          <$MTSetVar name="_pager_ellipsis" value="3"$>
        </MTIf>
      </MTIf>
      <MTIf name="_pager_counter" le="$_pager_range_stop">
        <$MTSetVar name="_pager_in_range" value="6"$>
      </MTIf>
    </MTIf>
    <MTIf name="_pager_ellipsis">
  <li class="<$MTVar name="pager_ellipsis_classname" _default="ellipsis index"
        $>"><span><$MTVar name="pager_ellipsis_label" _default="..." escape="html"$></span></li>
    </MTIf>
    <MTIf name="_pager_in_range">
      <MTIfPagerCurrent>
  <li class="<$MTVar name="pager_current_classname" _default="current index"
        $>"><span><$MTVar name="_pager_counter"$></span></li>
      <MTElse>
  <li class="<$MTVar name="pager_index_classname" _default="index"
        $>"><a href="<$MTPagerLink regex_replace="$_pager_strip_idx_regex","/$1"$>"><$MTVar name="_pager_counter"$></a></li>
      </MTIfPagerCurrent>
    </MTIf>
  </MTUnless>
  <MTIfPagerFooter>
    <$MTSetVar name="_pager_show_next" value="0"$>
    <MTUnless name="pager_show_next" eq="0">
      <MTUnless name="pager_show_next" eq="2">
        <$MTSetVar name="_pager_show_next" value="1"$>
      <MTElse>
        <MTIfPagerNext>
          <$MTSetVar name="_pager_show_next" value="2"$>
        </MTIfPagerNext>
      </MTUnless>
    </MTUnless>
    <MTIf name="_pager_show_next">
  <li class="<$MTVar name="pager_next_classname" _default="next"$>"><MTIfPagerNext
      ><a href="<$MTPagerNextLink$>"><MTElse><span></MTIfPagerNext
        ><$MTVar name="pager_next_label" _default="次" escape="html"$><MTIfPagerNext
          ></a><MTElse></span></MTIfPagerNext></li>
    </MTIf>
    <$MTSetVar name="_pager_show_last" value="0"$>
    <MTUnless name="pager_show_last" eq="0">
      <MTUnless name="pager_show_last" eq="2">
        <$MTSetVar name="_pager_show_last" value="1"$>
      <MTElse>
        <MTIfPagerNext>
          <$MTSetVar name="_pager_show_last" value="2"$>
        </MTIfPagerNext>
      </MTUnless>
    </MTUnless>
  <li class="<$MTVar name="pager_last_classname" _default="last"$>"><MTIfPagerNext
      ><a href="<$MTPagerLink$>"><MTElse><span></MTIfPagerNext
        ><$MTVar name="pager_last_label" _default="最後" escape="html"$><MTIfPagerNext
          ></a><MTElse></span></MTIfPagerNext></li>
</ul>
  </MTIfPagerFooter>
</MTPager>

このテンプレートでは、必要に応じてテンプレート変数によってページ送りナビゲーションの表示を変更できるようにしています。すべて既定値のある任意のオプション変数なので、テンプレートを貼り付けるだけで基本的なページ送りナビゲーションが出力されます。

pager_range: ナビゲーションで現在のページの前後に表示する項目数を整数で指定します。奇数を指定した場合、次のページを優先して1ページ分多く表示します。
既定値は「5」で、現在のページと前後2ページ分のリンクを表示します。
0を指定した場合、表示範囲を限定せずにすべてのページ分のリンクを表示します。
-1または整数以外の文字を指定するとページ数を列挙せずに、指定した文字 (-1を指定した場合は「/」) を挟んで現在のページ数と総ページ数だけ表示します。例えば「-1」や「/」を指定すると「7/13」のように分数で表示し、「 of 」を指定すると「7 of 13」のように表示します。
2要素の配列変数で前後の範囲を整数指定することも可能です。例えば「<$MTSetVar name="pager_range" value="1","3"$>」で前を1ページ分、次を3ページ分表示します。
pager_show_first: 0を指定すると「最初」のナビゲーション項目を非表示にします。2を指定すると最初のページでは「最初」のナビゲーション項目を非表示にします。
pager_show_last: 0を指定すると「最後」のナビゲーション項目を非表示にします。2を指定すると最後のページでは「最後」のナビゲーション項目を非表示にします。
pager_show_prev: 0を指定すると「前」のナビゲーション項目を非表示にします。2を指定すると最初のページでは「前」のナビゲーション項目を非表示にします。
pager_show_next: 0を指定すると「次」のナビゲーション項目を非表示にします。2を指定すると最後のページでは「次」のナビゲーション項目を非表示にします。
pager_first_label: 最初のページに移動するためのナビゲーション項目に表示する文字を指定します。既定値は「最初」です。
pager_last_label: 最後のページに移動するためのナビゲーション項目に表示する文字を指定します。既定値は「最後」です。
pager_prev_label: 前のページに移動するためのナビゲーション項目に表示する文字を指定します。既定値は「前」です。
pager_next_label: 次のページに移動するためのナビゲーション項目に表示する文字を指定します。既定値は「次」です。
pager_ellipsis_label: 表示範囲外を省略表記する文字を指定します。既定値は「...」です。
pager_classname: ナビゲーション用 ul 要素の class 属性値です。既定値は「pager」です。
pager_prev_classname: 前のページに移動するための li 要素の class 属性値です。既定値は「prev」です。
pager_next_classname: 次のページに移動するための li 要素の class 属性値です。既定値は「next」です。
pager_current_classname: 現在のページに関する li 要素の class 属性値です。既定値は「current index」です。
pager_index_classname: 指定ページに移動するための li 要素の class 属性値です。既定値は「index」です。
pager_ellipsis_classname: 表示範囲外を省略する li 要素の class 属性値です。既定値は「ellipsis index」です。
pager_fraction_classname: 変数「pager_range」の指定で分数表示する li 要素の class 属性値です。既定値は「fraction index」です。
pager_first_classname: 最初のページに移動するための li 要素の class 属性値です。既定値は「first」です。
pager_last_classname: 最後のページに移動するための li 要素の class 属性値です。既定値は「last」です。
pager_strip_index: 0を指定すると1ページ目 (最初) へのリンク先ファイル名から「index.html」のようなインデックス用ファイル名を削除せずにリンクします。2ページ目以降 (例: /index_2.html) には影響しません。
インデックス用ファイル名は環境変数「IndexBasename」で設定されます。

PowerCMS に同梱されているテーマではテンプレートの見通しや解りやすさを優先しているため、このようなテンプレートは採用していません。

MTInclude ファンクションタグでテンプレートモジュールにまとめたいところですが、機能の仕様による制限で MTPager ブロックタグは使用するアーカイブテンプレート内に記述する必要があります。アーカイブテンプレート内であれば MTSetVarBlock ブロックタグや setvar モディファイア (<MTPager setvar="pager_html">) 等でテンプレート変数に格納することは自由なので、例えば記事一覧の上下にまったく同じ HTML で2つ表示する場合は、一度テンプレートの序盤で構築したページ送りナビゲーションの HTML を変数に格納してから上下2か所に展開できます。

カテゴリー: テンプレート作成Tips

投稿者: y

コメントを投稿する

名前
電子メール
URL

サインイン情報を記憶

PowerCMS ブログ

静的ページ分割機能のページ送りナビゲーションをカスタマイズする (実践編)

あなたへお勧めの記事

コメントを投稿する

Archives

Recent Entries

Categories

PowerCMS ブログ

静的ページ分割機能のページ送りナビゲーションをカスタマイズする (実践編)

この記事と関連性の高い記事

あなたへお勧めの記事

コメントを投稿する

Archives

Recent Entries

Categories