日々カラーミーに関する様々なご相談が寄せられますが、先日伺ったのが「商品一覧を価格の高い順に表示したい」というもの。
たしかに「価格の安い順」は標準機能で用意されていますが、高い順はありません。
結論から言うと、「実装は可能だが、商品数が多いショップ様だと作業工数が増える」です。
「価格の安い順」を逆回しで表示する
価格の高い順ということは、価格の安い順をひっくり返せば良いので、テンプレートのsectionループにstep=-1を指定すると反対から表示されます。
<{section name=n loop=$productlist step=-1}>
loop content
<{/section}>価格降順以外は逆回しにしたくないので、実装する際は分岐させる必要があります。
<{* 一例 *}>
<{if $smarty.get.sort == 'p_desc'}>
<{* 価格降順のときのループ*}>
<{section step=-1 loop=$list}>
処理
<{/section}>
<{else}>
<{* それ以外のとき *}>
<{section loop=$list}>
上と同じ処理
<{/section}>
<{/if}>余談ですが、smartyには Array|@array_reverse という配列をひっくり返す修飾子もあるのですがカラーミーショップでは使用できません。これが使えればもっと楽に記述できるのですが残念です（余談おわり）。
ただし、これで解決できるのは「商品一覧が１ページに収まる場合のみ」です。
$productlist には該当ページの商品データしか入っていない
商品一覧のリスト情報である $productlist という変数（独自タグ）には、そのページに必要な商品の情報しか入っていません。
たとえば、全100商品で、1ページずつの表示件数を10件にしている場合、1ページ目の$productlistには1番～10番までの10商品データ。… 10ページ目には91番～100番までの10商品 という感じです。
このように複数ページに渡る状態で価格の安い順を逆にしたとしても、一番高い商品は最後のページに存在するままですので意味がありません。
この問題をクリアするためには、1ページの表示件数 > 全商品数 に設定しておく必要があります。
＊１ページあたりの表示件数は、 管理画面 > デザイン > 「商品の表示順・表示数の設定」 で指定できます。
商品数が多いショップはどうするのか
ミフネWEBで担当させていただいているショップ様の中には、1万点以上の商品を扱っておられるお店もいくつかあります。
そんなショップ様が１ページに全件表示なんてしたら大変なことになります。せいぜい100件 / 1ページ ぐらいです。
このような1ページ全件表示が難しいショップ様にご提案できるのは以下3通りです。
案１：全件表示にして、ロード時は一部を表示する
(共通の前提で、全100件・10件ずつ表示したい とします。)
ぺージ読み込み時点では最初の10件だけを表示。11件目以降はcssで非表示にしておき、「もっと見る」ボタンを追加して10件ずつ表示を増やしていく。または、底まできたら自動で続きを表示する。
どちらもJavaScriptで表示/非表示を制御します。
Lighthouseから「DOMが多い」という文句は出るかも知れません。
案２ :APIを利用
全件表示の方法は使用せず、APIから商品情報を取得し価格降順で10件ずつ表示する。
カラーミーの商品APIは最大1,000件までしか取得できないのですが、大体のショップ様ならこれで解決できるのではないかと思います。
1,000点を超えるショップ様はAPIサーバを自作するなりして対応することになります。
案3 : 諦める
「価格降順にする」ことに、そこまでの必要性が無いのであれば潔くあきらめましょう。
もしかすると、降順にこだわるよりもっと大切なことが他にあるかも知れません。
まとめ
商品数がすくなければ、<{section name=n loop=$productlist step=-1}> でOK。
商品数が多いときは、なんらかのJS処理で対応するか諦めましょう。
