EC-CUBEカスタマイズBootstrap版(10)商品詳細ページ

この記事のインデックス

EC-CUBEカスタマイズダウンロード:Bootstrap版デモサイト

インストールと同時にこのようなサイトが立ち上がります。
管理画面で店舗情報等を登録すれば、すぐに運用が可能です。

詳しくはこちらをご覧ください。

▼商品詳細ページ

001

(1)レイアウトの変更

テンプレートファイルのコードを入れ替えることでレイアウトを変更することが可能です。
■data/Smarty/templates/default/products/detail.tpl

002

(2)商品ステータス

管理画面、システム設定>マスターデータ管理の[mtb_statua]で登録されている値が表示されます。
[mtb_status_image]は使用していません。
EC-CUBEの通常の動作に戻す(mtb_status_imageを使用)場合は、パラメータ設定[STATUS_IMAGE_TEXT ]の値をtrueに変更して下さい。

005

ステータスの背景色を変更する場合、あるいは追加する場合は、CSSを編集してください。
■html/user_data/packages/default/css/contents.css
865行目付近、「商品詳細」の箇所
———-
ul.detail_status_icon li#status1 {
background: #FFD1BB;
}
ul.detail_status_icon li#status2 {
background: #FFD2E9;
}
ul.detail_status_icon li#status3 {
background: #FAA;
}
ul.detail_status_icon li#status4 {
background:#E2F2FA;
}
ul.detail_status_icon li#status5 {
background:#D7E8CA;
}
———-

 

(3)商品情報

デモサイトの「サイズ」「材質」「耐荷重」等は、管理画面の商品登録画面で設定された内容が反映されています。

006

「サイズ」「材質」「耐荷重」等の項目は、システム設定>マスターデータ管理の[mtb_product_head]で登録します。
登録数は10個までです。

007

(4)規格の選択方法

パラメータ設定[CLASS_PULL_TABLE]の値を「false」に変更すると、プルダウン形式で表示されます。

008

009

(5)規格ごとの詳細を表示

パラメータ設定で詳細の表示・非表示を設定できます。
▼MATRIX_NORMAL_PRICE
商品詳細ページのマトリクス表示:通常価格(true:表示, false:非表示)
▼MATRIX_POINT
商品詳細ページのマトリクス表示:ポイント(true:表示, false:非表示)
▼MATRIX_PRODUCT_CODE
商品詳細ページのマトリクス表示:商品コード(true:表示, false:非表示)
▼MATRIX_STOCK
商品詳細ページのマトリクス表示:在庫数(true:表示, false:非表示)
▼MATRIX_SALE_LIMIT
商品詳細ページのマトリクス表示:一度に購入できる数(true:表示, false:非表示)
▼MATRIX_CLASS_IMAGE
商品詳細ページのマトリクス表示:規格画像確認リンク(true:表示, false:非表示)

010

すべて表示した場合、下図のようになります。

011

(6)数量選択のプルダウン

① パラメータ設定[QUANTITY_PULLDOWN_USE]の値を「false」に変更すると、プルダウン化は解除されEC-CUBE通常のテキストボックスで表示されます。

003

② [QUANTITY_PULLDOWN_MAX]で、プルダウンの数値の最大値を設定します。インストール時はデフォルト「100」に設定されています。

③ 商品に在庫数または販売制限数が設定されている場合は、プルダウンの数値の最大値は、在庫数または販売制限数となります。

012

(7)お気に入り追加ボタン

ユーザーがログイン前にクリックした場合は、MYページログイン画面に遷移します。

EC-CUBEカスタマイズダウンロード:Bootstrap版デモサイト

インストールと同時にこのようなサイトが立ち上がります。
管理画面で店舗情報等を登録すれば、すぐに運用が可能です。

詳しくはこちらをご覧ください。