EC-CUBE「カラー選択」プラグイン。商品ページの規格プルダウンを画像に変更できる。

カラー選択プラグイン
カラー選択プラグインの利用方法

カラー選択プラグイン

「カラー選択プラグイン」は、規格をプルダウン形式から画像形式に変更することが可能です。
また、在庫状況により◯や△を表示します。

カラー選択プラグインの利用方法

カラー選択（カラーセレクト）プラグインの利用方法をご説明します。

カラーセレクト設定画面

プラグインをインストール・有効化すると管理画面＞プラグイン一覧に[設定]アイコンが表示されます。

設定画面では最低在庫数を選択する必要があります。
デフォルトでは未入力となっており、そのままプラグインを利用すると商品詳細ページがシステムエラーで表示されません。
必ず最低在庫数を選択してください。

商品登録画面

商品登録画面には「カラー画像1〜8」「カラー名1〜8」が追加されており、商品に対してカラー画像を登録することができます。

カラー画像1〜8	[ファイル選択]ボタンをクリックし画像ファイルを選択後、[ファイル保持]ボタンをクリックすると画像がセットさrます。
カラー名1〜8	カラー名を入力します。この時、規格の規格分類名と同じ名称を入力する必要があります。

カラー名は規格の規格分類名と同じ名称を入力する

カラー名は規格の規格分類名と同じ名称を入力します。
商品登録画面のカラー名と規格分類名が同じであれば、プラグインは規格と画像を紐付けます。
少しでも異なっているとプラグインは規格と画像を紐づけることができません。

商品に規格を紐づける

その後、商品に規格を紐づけます。
規格を紐づける方法はEC-CUBE標準の方法で問題ありません。

商品ページに規格画像が表示されます

以上の手続きを行うと、商品詳細ページの規格プルダウンが画像として表示されるようになります。
本プラグインは規格１のみ画像を登録することができます。
その為、規格2はボックスの中に文字が表示されます。
下のキャプチャ画像ですと、サイズ「S」「M」「L」は画像ではなく、ボックス内に「S」「M」「L」という文字が表示されています。

また、商品在庫数がカラーセレクト設定画面が設定した最低在庫数より多い場合◯が表示され、最低在庫数以下の場合△が表示されます。
ちなみに、在庫がゼロだとサイズが選択できなくなります。
画像のホワイトMは在庫がゼロの為、Mが選択できなくなっています。

カラー選択プラグインという名前ですが、カラーでなくても色々な用途に使えそうな便利なプラグインです。

投稿者プロフィール

Nakamura: サンクユーのEC-CUBE先生。
EC-CUBEのカスタマイズをし出して早15年。
難易度の高いカスタマイズもお任せ。
２系、3系、4系すべて対応可能。

実はjavaでの業務システム開発がエンジニア人生のスタート。
PHP、Perl、フロントエンド開発、Movable Type、Wordpressも得意という万能エンジニア。