要望や症状
特定のカテゴリの商品一覧ページでのみHTMLやメッセージを表示したいが、商品一覧のTwigテンプレートを編集すると、すべてのカテゴリページに同じ内容が表示されてしまう。カテゴリごとに異なる説明文やヘッダーを表示することができない。
理由や原因
EC-CUBEの標準商品一覧テンプレートは、すべてのカテゴリで共通のレイアウトを使用する仕組みになっています。そのため、テンプレートファイルを直接編集するだけでは、特定のカテゴリのみに表示を限定することができません。カテゴリごとに表示内容を変更するには、テンプレート内でカテゴリの情報を判定する条件分岐処理を実装する必要があります。
解決策
商品一覧テンプレートファイル ECCUBEROOT/app/template/[template_code]/Product/list.twig を編集して、カテゴリの判定ロジックを追加します。
カテゴリIDで判定する方法
最も確実な方法として、カテゴリIDを使用した判定があります。
{# 特定カテゴリのヘッダー文字表示 #}
{% if Category and Category.getId() == 1 %}
<div class="category-header">
<h2>特別なカテゴリのヘッダー文字</h2>
<p>このカテゴリの説明文をここに記載</p>
</div>
{% elseif Category and Category.getId() == 5 %}
<div class="category-header">
<h2>別のカテゴリのヘッダー文字</h2>
</div>
{% endif %}
カテゴリ名で判定する方法
カテゴリ名を基準にした判定も可能です。ただし、カテゴリ名を変更した場合は条件も更新する必要があります。
{% if Category and Category.getName() == 'セール商品' %}
<div class="sale-header">
<h2>🔥 セール開催中！ 🔥</h2>
<p>対象商品が最大50%OFF</p>
</div>
{% endif %}
複数条件での判定
複数のカテゴリIDやカテゴリ名をまとめて指定することも可能です。
{% set target_category_ids = [1, 3, 5] %}
{% if Category and Category.getId() in target_category_ids %}
<div class="special-category-message">
<p>こちらは特別なカテゴリです</p>
</div>
{% endif %}
実装時の注意点
カテゴリIDの確認方法 カテゴリIDは管理画面の「コンテンツ管理 > カテゴリ管理」から確認できます。カテゴリの編集画面でURLのパラメータからもIDを確認可能です。
テンプレートファイルのバックアップ カスタマイズ前に必ずオリジナルファイルのバックアップを取得してください。
アップデート時の影響 テンプレートカスタマイズはEC-CUBEのバージョンアップ時に上書きされる可能性があります。アップデート後は修正内容を再適用する必要がある場合があります。
大量のカテゴリ対応 多数のカテゴリで個別の表示が必要な場合は、プラグインの開発や利用を検討することを推奨します。