color me shopにページャーをつける
color me shopをいじる機会があったので、今回作ったページャーをご紹介。
テンプレートは、smartyなので馴染みがあり、やりやすかったです。
目指す表示はこんな感じ
<< 前のページへ 1 ・・ 4 5 6 ・・・ 10 次のページへ >>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | <div class="pnavi"> <{* 現在表示中のページ数をcurrent_pageに設定 *}> <{ if $smarty.get.page == "" }><{ assign var="current_page" value="1" }><{else}><{ assign var="current_page" value=$smarty.get.page }><{/if}> <{* 前のページがある場合は、リンク化する *}> <{if $productlist_prev_page != ""}><a href="<{$productlist_prev_page}>" title="Page <{$current_page-1}>"><< 前のページへ</a><{else}> << 前のページへ <{/if}> <{* ページ表示数で商品数を割り、ページ数を算出 *}> <{math equation="ceil($productlist_num/12)" assign="max_page"}> <{math equation="$current_page-1" assign="bef_page" }> <{math equation="$current_page+1" assign="aft_page" }> <{ assign var="page_flg" value="0" }> <{section name=pager loop=$max_page }> <{* 表示中のページに、専用のclassを付与する *}> <{ if $smarty.section.pager.iteration == $current_page }> <span class="here"><{$smarty.section.pager.iteration }></span> <{ else }> <{ if $productlist_sort_now == "p" }> <{ assign var="page_url" value=$productlist_sort_price|cat:"&page="|cat:$smarty.section.pager.iteration }> <{ elseif $productlist_sort_now == "n" }> <{ assign var="page_url" value=$productlist_sort_new|cat:"&page="|cat:$smarty.section.pager.iteration }> <{ else }> <{ assign var="page_url" value=$productlist_sort_def|cat:"&page="|cat:$smarty.section.pager.iteration }> <{ /if }> <{ if $max_page > 7 }> <{* 1ページ目と最終ページ、現在表示しているページの前後1ページをリンクとして表示 *}> <{ if in_array($smarty.section.pager.iteration, array(1,$bef_page, $aft_page, $max_page)) }> <{ assign var="page_flg" value="0" }> <a href="<{$page_url}>" title="Page <{$smarty.section.pager.iteration }>"><{ $smarty.section.pager.iteration }></a> <{ elseif $page_flg == "0" }> <{ assign var="page_flg" value="1" }> ・・・ <{ /if }> <{ else }> <a href="<{$page_url}>" title="Page <{$smarty.section.pager.iteration }>"><{ $smarty.section.pager.iteration }></a> <{ /if }> <{ /if }> <{/section}> <{* 次のページがある場合は、リンク化する *}> <{if $productlist_next_page != ""}><a href="<{$productlist_next_page}>" title="Page <{$current_page+1}>">次のページへ >></a><{else}> 次のページへ >> <{/if}> </div> |