Web制作
トップページ > ブログ > Web制作 > 【EC-CUBE4】商品一覧ページでページ送りがある場合とない場合の条件分岐

【EC-CUBE4】商品一覧ページでページ送りがある場合とない場合の条件分岐

EC-CUBE4系にて、商品一覧ページ(デフォルトではhttps://abc.com/products/list)のページネーションが指定されているかどうかで表示内容を条件分岐させたいときのTipsになります。

EC-CUBE4系では、テンプレートエンジンにtwigが採用されておりますが、今回は商品一覧ページですので、/Product/list.twigを修正していきます。

目次

ページネーションから画面遷移を判断する

EC-CUBE4系のページネーション

今回は商品一覧ページでページネーション(ページ送り)が発生しているかどうかによって条件分岐をさせたいので、いくつか方法はあると思いますが、ページURLにページネーションのパラメータが付いているかどうかによって条件を分岐させようと思います。

ページネーションのパラメータを取得する

EC-CUBE4系ではデフォルト設定では、ページネーションが選択された場合、URLの末尾に「pageno=x」というパラメータが付与されます。

そこで、まずはURLを取得します。

app.request.server.get('REQUEST_URI')

これでURLが取得できました。

ページネーションの有無に関する分岐条件を指定する

先述したようにページネーションの有無はURLの末尾に「pageno=x」というパラメータが付与されているかどうかで分かります。

URLに「pageno」を含む場合とそうでない場合で表示する内容を変えたいので、以下のようにします。

{% set request_uri = app.request.server.get('REQUEST_URI') %}
{% if 'pageno' in request_uri %}
  <p>URLにpagenoが含まれている場合の内容</p>
{% else %}
  <p>URLにpagenoが含まれていない場合の内容</p>
{% endif %}

これで商品一覧ページでページ送りがある場合とない場合の条件分岐が完了となります。

もう一歩踏み込んで具体的な条件分岐をする

ページネーションを選択してない場合と、ページネーション「1」を選択した場合は、同じ内容を表示させたいため、以下のようにしてみました。

{% if Category.id == 100 %}{# 数値はカテゴリid #}
    {% set body = '
    <p>ページネーション無しのときに表示させたい内容</p>
    <p>タグを含んでもエスケープすれば可</p>
    ' %}

    {% set request_uri = app.request.server.get('REQUEST_URI') %}{# ページネーション選択無しの場合 #}
    {% if 'pageno' in request_uri %}
    {% else %}
        {{ body|raw }}{# |rawを付与してエスケープ #}
    {% endif %}
    
    {% set request_uri = app.request.server.get('REQUEST_URI') %}{# ページネーションで「1」を選択した場合 #}
    {% if 'pageno=1' in request_uri %}
        {{ body }}{# |rawを付与しないとタグがそのまま文字列として表示されます #}
    {% endif %}
    
{% endif %}

もう少しスマートに書けそうですが、変数に表示させたい内容をsetしておけば仮に内容変更があっても1ヵ所で済むのでとりあえずはこんな感じにしました。

{{ body|raw }}

HTMLタグを含む内容の場合は、ここでエスケープ処理をしないとタグがそのまま表示されてしまうので注意が必要です。

ページトップへ戻る