商品に任意の追加項目を設定できるプラグインです。
表示箇所は商品詳細ページに限らず、商品一覧やカートページなど、タグ一つでどこでも表示が可能です。
テキスト・画像・ファイル・日付・セレクトボックスなど、10種類のフィールドタイプに対応しており、表示対象(全ユーザー / 会員のみ / ゲストのみ)を制御できます。
- プラグインをインストール&有効化してください。
-
管理画面 > 商品管理 > 商品追加項目管理 より追加項目を登録してください。
-
管理画面 > 商品管理 > 商品登録 の各商品ページで、追加項目の値を入力してください。
-
管理画面 > コンテンツ管理 > キャッシュ管理 より キャッシュ削除 を行ってください。
-
管理画面 > コンテンツ管理 > ページ管理 > 商品詳細ページ の コード から、任意の商品追加項目を表示するタグを配置してください。
本プラグインは 商品追加項目管理 のマスタ項目のうち、有効 な項目のみを商品CSVに連携します。
商品CSVの入出力に追加項目を反映するには、商品追加項目管理 上でマスタ項目を登録・編集し、必要な項目を有効化してください。
現状の仕様では、プラグインを無効化してから再度有効化した場合、商品追加項目情報が商品CSVへ自動的に再登録されません。
有効化後に 商品追加項目管理 のいずれかのマスタ項目を有効化、無効化、または編集して保存することで、商品CSVに全項目が反映されます。
- 商品CSV のエクスポートで 商品追加項目 を出力できるようになります。
-
管理画面 > 設定 > 店舗設定 > CSV出力項目設定 の 商品CSV より、商品追加項目 を出力する項目に追加してください。
-
商品CSV拡張プラグイン(4.3系) を導入いただくと 商品CSV から 商品追加項目 を読み込めるようになります。
有効な項目を管理画面で設定した並び順に表示します。公開制限(すべてのユーザー / ログインユーザー / ゲストユーザー)を考慮した項目のみが表示されます。
{{ include('@BootechProductItemPlus43/front/product_item_plus_list.twig', { Product: 商品データのオブジェクト }, with_context = true, ignore_missing = true) }}
例:商品データのオブジェクトが Product (商品詳細ページや商品一覧ページ等)の場合
{{ include('@BootechProductItemPlus43/front/product_item_plus_list.twig', { Product: Product }, with_context = true, ignore_missing = true) }}
指定した項目IDのうち、有効な項目を ItemIds に指定した順番で表示します。公開制限(すべてのユーザー / ログインユーザー / ゲストユーザー)を考慮した項目のみが表示されます。
{{ include('@BootechProductItemPlus43/front/product_item_plus_list_by_item_id.twig', { Product: 商品データのオブジェクト, ItemIds: [項目ID(カンマ区切り複数可)] }, with_context = true, ignore_missing = true) }}
例:商品詳細ページや商品一覧ページ等で項目ID 5、3、1 の項目のみを指定した順番で表示する
{{ include('@BootechProductItemPlus43/front/product_item_plus_list_by_item_id.twig', { Product: Product, ItemIds: [5, 3, 1] }, with_context = true, ignore_missing = true) }}
有効・無効や公開制限に関わらず、指定した項目IDの値をそのまま返します。
詳細な表示カスタマイズを行いたい際に活用いただけます。
{{ product_item_display_name(商品データのオブジェクト, 項目ID) }} {# 項目名 #}
{{ product_item_value(商品データのオブジェクト, 項目ID) }} {# 項目値 #}
{{ product_item_field_type_id(商品データのオブジェクト, 項目ID) }} {# 登録タイプID #}
例:商品詳細ページや商品一覧ページ等で項目ID 1 の項目名、項目値、登録タイプID を取得・表示する
{{ product_item_display_name(Product, 1) }} {# 項目名 #}
{{ product_item_value(Product, 1) }} {# 項目値 #}
{{ product_item_field_type_id(Product, 1) }} {# 登録タイプID #}
項目名・項目値・登録タイプID を個別に取得する(有効・公開制限を考慮)
有効でない項目、またはログイン状態が公開制限と一致しない項目は、空文字(登録タイプIDは 0)を返します。
詳細な表示カスタマイズを行いたい際に活用いただけます。
{{ product_item_display_name_safe(商品データのオブジェクト, 項目ID, is_granted('ROLE_USER')) }} {# 項目名 #}
{{ product_item_value_safe(商品データのオブジェクト, 項目ID, is_granted('ROLE_USER')) }} {# 項目値 #}
{{ product_item_field_type_id_safe(商品データのオブジェクト, 項目ID, is_granted('ROLE_USER')) }} {# 登録タイプID #}
例:商品詳細ページや商品一覧ページ等で項目ID 1 の項目名、項目値、登録タイプID を取得・表示する
{{ product_item_display_name_safe(Product, 1, is_granted('ROLE_USER')) }} {# 項目名 #}
{{ product_item_value_safe(Product, 1, is_granted('ROLE_USER')) }} {# 項目値 #}
{{ product_item_field_type_id_safe(Product, 1, is_granted('ROLE_USER')) }} {# 登録タイプID #}
表示条件を満たす項目ID一覧を管理画面で設定した表示順で取得する
表示条件(有効・公開制限)を満たす項目ID一覧をリスト形式(配列)で返します。product_item_sorted_ids でフィルタ済みのIDに対して使用することを想定しています。
{% set ids = product_item_sorted_ids(商品データのオブジェクト, is_granted('ROLE_USER')) %}
{% for id in ids %}
{{ product_item_display_name(商品データのオブジェクト, id) }}
{{ product_item_value(商品データのオブジェクト, id) }}
{{ product_item_field_type_id(商品データのオブジェクト, id) }}
{% endfor %}
使用例:商品詳細ページや商品一覧ページ等で、表示条件を満たす追加項目を管理画面で設定した表示順で一覧表示し、登録タイプ別に表示を切り替える
{% set is_logged_in = is_granted('ROLE_USER') %}
{# 表示条件を満たす項目ID一覧を管理画面の表示順で取得 #}
{% set ids = product_item_sorted_ids(Product, is_logged_in) %}
{% for id in ids %}
{% set display_name = product_item_display_name(Product, id) %}
{% set display_value = product_item_value(Product, id) %}
{% set field_type_id = product_item_field_type_id(Product, id) %}
<h3>{{ display_name }}</h3>
{% if field_type_id == 1 %}
{# TEXT(1): HTML レンダリング可能 #}
{{ display_value|raw }}
{% elseif field_type_id == 2 %}
{# TEXTAREA(2): HTML レンダリング可能 #}
{{ display_value|raw|nl2br }}
{% elseif field_type_id == 3 %}
{# SELECT(3): 選択肢の表示名を表示 #}
{{ display_value }}
{% elseif field_type_id == 4 %}
{# MULTISELECT(4): 選択肢の表示名をカンマ区切りで表示(sort_no 昇順) #}
{% set option_list = display_value|split(', ') %}
{% for item in option_list %}
<span class="badge bg-secondary mr-1 my-1">{{ item }}</span>
{% endfor %}
{% elseif field_type_id == 5 %}
{# RADIO(5): 選択肢の表示名を表示 #}
{{ display_value }}
{% elseif field_type_id == 6 %}
{# CHECKBOX(6): 選択肢の表示名をカンマ区切りで表示(sort_no 昇順) #}
{% set option_list = display_value|split(', ') %}
{% for item in option_list %}
<span class="badge bg-secondary mr-1 my-1">{{ item }}</span>
{% endfor %}
{% elseif field_type_id == 7 %}
{# IMAGE(7): <img> タグで表示 #}
{% if display_value %}
<img src="{{ asset(display_value, 'save_image') }}" alt="{{ display_name }}">
{% endif %}
{% elseif field_type_id == 8 %}
{# FILE(8): <a> タグに download 属性を付与 #}
{% if display_value %}
<a href="{{ asset(display_value, 'save_image') }}" download>ダウンロード</a>
{% endif %}
{% elseif field_type_id == 9 %}
{# DATE(9): 2026年1月1日 形式 #}
{% set dayOfWeek = display_value|date('w') %}
{% set dayOfWeekName = ['日', '月', '火', '水', '木', '金', '土'][dayOfWeek] %}
{{ display_value|date('Y年m月d日') }}({{ dayOfWeekName }})
{% elseif field_type_id == 10 %}
{# DATETIME(10): 2026年1月1日(水) 12:00 形式 #}
{% set dayOfWeek = display_value|date('w') %}
{% set dayOfWeekName = ['日', '月', '火', '水', '木', '金', '土'][dayOfWeek] %}
{{ display_value|date('Y年m月d日') }}({{ dayOfWeekName }}) {{ display_value|date('H:i') }}
{% endif %}
{% endfor %}
{% block main %}
...
...
... この間に任意のタグを配置してください。
...
...
{% endblock %}
{% for Product in pagination %}
...
...
... この間に任意のタグを配置してください。
...
...
{% endfor %}
商品データのオブジェクトを取得している箇所であれば、あらゆる箇所で項目の情報を表示できます。
例:関連商品ブロックなど、ループ変数が Product 以外の名前の場合
...
{% for RelatedProduct in Product.RelatedProducts %}
...
...
... {{ include('@BootechProductItemPlus43/front/product_item_plus_list.twig', { Product: RelatedProduct.ChildProduct }, with_context = true, ignore_missing = true) }}
... {{ product_item_display_name_safe(RelatedProduct.ChildProduct, 4) }}
... {{ product_item_value_safe(RelatedProduct.ChildProduct, 4) }}
... {{ product_item_field_type_id_safe(RelatedProduct.ChildProduct, 4) }}
...
...
{% endfor %}
...
例:おすすめ商品などのブロックテンプレート内で、ループ変数が RecommendProduct の場合
...
{% for RecommendProduct in recommend_products %}
...
...
... {{ include('@BootechProductItemPlus43/front/product_item_plus_list.twig', { Product: RecommendProduct }, with_context = true, ignore_missing = true) }}
... {{ product_item_display_name_safe(RecommendProduct, 4) }}
... {{ product_item_value_safe(RecommendProduct, 4) }}
... {{ product_item_field_type_id_safe(RecommendProduct, 4) }}
...
...
{% endfor %}
...
※正しい場所に配置しないと動作しません。
※タグ配置後は 管理画面 > コンテンツ管理 > キャッシュ管理 より キャッシュ削除 を行ってください。
商品追加項目一覧 /{ECCUBE_ADMIN_ROUTE}/product/product_item_plus
登録済みの追加項目を一覧表示します。
- ドラッグ&ドロップによる表示順の変更
- 項目ごとの有効化 / 無効化
- 項目の新規登録・編集・削除
一覧に表示される列:
項目編集 /{ECCUBE_ADMIN_ROUTE}/product/product_item_plus/{項目ID}/edit
以下の項目を設定できます。
有効・無効
フロント・管理画面への表示 ON / OFF
登録タイプ
フィールドタイプ(新規登録時のみ選択可)
選択肢一覧 /{ECCUBE_ADMIN_ROUTE}/product/product_item_plus/{項目ID}/option
登録タイプが Select / Multiple Select / Radio / Checkbox の項目のみ表示されます。
- ドラッグ&ドロップによる表示順の変更
- 選択肢の有効化 / 無効化
- 選択肢の新規登録・編集・削除
一覧に表示される列:
初期選択
商品登録フォームでのデフォルト選択(◯ で表示)
選択肢編集 /{ECCUBE_ADMIN_ROUTE}/product/product_item_plus/{項目ID}/option/{選択肢ID}/edit
以下の項目を設定できます。
有効・無効
フロント・管理画面への表示 ON / OFF
初期選択
商品登録フォームでデフォルト選択状態にするか
2
Textarea
複数行テキスト(HTML可)
4
Multiple Select
セレクトボックス(複数選択)
6
Checkbox
チェックボックス(複数選択)
Select / Multiple Select / Radio / Checkbox は、別途 選択肢の登録 が必要です。
1
すべてのユーザー
ログイン・非ログイン問わず表示
product_item_sorted_ids(Product, isLoggedIn)
表示条件(有効・公開制限)を満たす項目IDを管理画面の表示順で返す
項目IDの配列
—
product_item_display_name(Product, id)
指定した項目IDの表示名を返す(有効・公開制限を考慮しない)
表示名(string)
—
product_item_value(Product, id)
指定した項目IDの入力値を返す(有効・公開制限を考慮しない)
入力値(string)
—
product_item_field_type_id(Product, id)
指定した項目IDのフィールドタイプIDを返す(有効・公開制限を考慮しない)
フィールドタイプID(int)
—
product_item_display_name_safe(Product, id, isLoggedIn)
指定した項目IDの表示名を返す(有効・公開制限を考慮する)
表示名(string)
''
product_item_value_safe(Product, id, isLoggedIn)
指定した項目IDの入力値を返す(有効・公開制限を考慮する)
入力値(string)
''
product_item_field_type_id_safe(Product, id, isLoggedIn)
指定した項目IDのフィールドタイプIDを返す(有効・公開制限を考慮する)
フィールドタイプID(int)
0
Textarea
入力テキスト(HTML出力・改行変換可)
Select / Radio
選択された選択肢の表示名
Multiple Select / Checkbox
, 区切りの表示名(例: 選択肢A, 選択肢B)
Date
日付文字列(例: 2026-01-01)
Date Time
日時文字列(例: 2026-01-01 12:00:00)
デモ環境で動作をご確認いただけます。アクセス情報は下記をご参照ください。
※デモ環境は、EC-CUBEのデフォルト環境にプラグインをインストールし、有効化したのみの状態です。プラグインの仕様によっては、別途追加の設定が必要になる場合がございます。
4.3.x 系
フロント 管理画面 ログインID: administrator パスワード: password12345678
4.2.x 系
フロント 管理画面 ログインID: administrator パスワード: password12345678
4.1.x 系
フロント 管理画面 ログインID: administrator パスワード: password12345678
4.0.x 系
フロント 管理画面 ログインID: administrator パスワード: password12345678
- 毎日午前0時より数分間、システムメンテナンスを実施します。この間、初期化処理を行うため、設定情報がリセットされます。
- 事前の予告なしに、システムメンテナンスを実施する場合があります。
- デモ環境で不具合などを発見された場合は、サポートまでメールでご連絡ください。
プラグインのロジック変更や項目追加のほか、本体カスタマイズも承っております。お気軽にこちらまでご連絡ください。
EC-CUBE やシステム開発関連の情報発信をしています。詳しくは、Bootech 公式サイトをご覧ください。
EC-CUBE 4系のローカル環境構築プロジェクトの運営も行なっています。詳しくは、Docker for EC-CUBE 4をご確認ください。
この商品に対するお客様の声