商品一覧ページの並び替えについて [らくうるカート]

らくうるカートの商品一覧ページ(カテゴリ・キャンペーン・検索結果)の並び順は、以前までは「価格の安い順・高い順・更新日順」の3パターンでしたが、2021年6月から「名前順・おすすめ順」の2つが加わり、5パターンの並び替えが可能となっています。

並び替えの設定は 商品管理 > 商品一覧表示設定 からできますが、 「2021年6月8日以前に追加したテンプレートでは初期表示順に「商品名順」「優先設定順」を利用いただけません。」 と表示が出てくるので諦めた方もいるかもしれません。しかし古いテンプレートのままでも数行のコードを書き加えれば新しい並び替えに対応できます。

諦めかけていた方からご相談を受けたので、そのやり方を紹介しておこうと思います。

新しい2種類の並び替えを追加する

商品一覧のテンプレートをひらくと、下のようなコードがあるので、

{% set sortOrder = '&sortKind=1' %} 
{% if sortKind == '2' %}
{% set sortOrder = '&sortKind=2' %} 
{% elseif sortKind == '3' %}
{% set sortOrder = '&sortKind=3' %} 
{% endif %}

下のように4と5を追加。

{% set sortOrder = '&sortKind=1' %} 
{% if sortKind == '2' %}
{% set sortOrder = '&sortKind=2' %} 
{% elseif sortKind == '3' %}
{% set sortOrder = '&sortKind=3' %} 
{# ここから追加 #}
{% elseif sortKind == '4 %}
{% set sortOrder = '&sortKind=4' %} 
{% elseif sortKind == '5' %}
{% set sortOrder = '&sortKind=5' %} 
{# ここまで #}
{% endif %}

あとは、並び替え用のボタンがある箇所に4と5用のリンクを追加してやれば対応終了です。状況によって4のみ、または5のみ。あるいは1と3と5のみ、のような設定でも問題ありません、

{% if sortKind == '1' %}
<li><span>価格の低い順</span></li>
<li><a href="/item-list?sortKind=2{{ condition }}">価格の高い順</a></li>
<li><a href="/item-list?sortKind=3{{ condition }}">更新日順</a></li>
<li><a href="/item-list?sortKind=4{{ condition }}">名前順</a></li>
<li><a href="/item-list?sortKind=5{{ condition }}">おすすめ順</a></li>
{# 以下略 #}

ただし、並び替え項目が増えることでデザインがずれると思いますので、そこはCSSで各自調整してください。

らくうるカート

かなりの自動化が可能なので、1人店長やショップ運営の時間を短縮したい&ヤマト運輸を利用されている方には本当におすすめのショッピングカートです。

テンプレート制作・フリーページ制作・オープン前作業のあれこれ(商品登録・決済の設定、自動送信メールの条件分岐・送料の設定 etc)等、らくうるカートに関する制作・カスタマイズは何でも承ります。

お問い合わせ・ご相談

Author

ミフネWEBのロゴ

ネットショップ専門のWEBサイト制作事務所です(個人事務所)。

部分的なテンプレートカスタマイズから、高速化や機能追加、新規ショップ制作などECに関するいろいろを承ります。(5,500円〜)

仕事のご相談は「お問い合わせ・ご相談」より随時承っております。