• No : 4711
  • 公開日時 : 2018/11/21 10:14
  • 更新日時 : 2019/08/06 12:06
  • 印刷

セール商品など特定の商品群に対して、共通する画像やテキストを簡単に設定する方法はありますか?

サポートカテゴリー : 

回答

コマースクリエイターご利用店舗様専用の記事です

セール商品の商品詳細ページに「セール対象商品」というテキストを共通表示したり、
ポイントUPキャンペーンを行っている商品の商品詳細ページに「キャンペーン対象商品」というバナーを共通表示したりするなど
特定の商品群に対して共通する画像やテキストを表示したい場合
コマースクリエイターでは「レイアウトパーツの表示条件機能」を利用することで簡単に実現可能です。

 ■オンラインマニュアル:レイアウトパーツ

 

ここでは一例として、セール対象商品の商品詳細ページに「★セール対象商品★」というテキストを共通表示する方法をご案内します。

 

設定方法

1.商品にタグを設定する

セール対象商品の商品基本情報編集画面を開き「セール」というタグを設定します。
タグの詳しい設定方法は以下をご参照ください。

■虎の巻 「商品タグ」って何ですか?
http://qa.future-shop.jp/faq/show/2053

 

対象商品が多い場合、CSVを利用して一括登録することもできます。

■マニュアル 商品タグ登録
https://www.future-shop.jp/manual/regist/goodsTag.html

 

2.共通表示したい内容を「フリーパーツ」で作る

commerce creator>パーツ>左下の「パーツを追加する」 にて、
フリーパーツを選択し、表示させたい文言や画像を入力したパーツを作成します。

<例>

(1)パーツ名 : セール対象商品用パーツ
(2)置換文字 : sale_item
(3)表示内容 : ★セール対象商品★





 

3.商品詳細ページにレイアウトパーツを設定する

commerce creator>テーマ>利用中テーマの「レイアウト」>商品詳細レイアウト をクリックして編集画面を開きます。
メインエリア >コンテンツエリア >商品詳細エリア の順に開き、
商品詳細エリア内の任意の箇所(「商品画像・商品説明など」や「商品名・価格など商品情報」エリア内でも可)にて
「レイアウトパーツを追加する」をクリックして、レイアウトパーツを追加します。

<例>

(2)パーツ名 : 「セール」タグがある商品のみ表示するパーツ
(3)HTML :HTML要素「div」 class「sale_item_only」

 

 

4.レイアウトパーツに表示条件を設定する

作成したレイアウトパーツの をクリックし、「表示条件を設定する」を選択します。

「表示条件を設定」の画面内で商品タグにチェックを入れ、「セール」と入力し、画面最下部の「OK」をクリックします。




5.表示条件を設定したレイアウトパーツ内に作成したフリーパーツを設置する

表示条件を設定したレイアウトパーツの をクリックし、手順2で作成したフリーパーツを設置します。




以上で完了です。


表示条件には、
商品タグの他に、商品グループ・バンドル割引対象・販売期間などでも設定ができますので、
例えば、
・Tシャツのグループにのみ特定の文言を表示
・まとめ買い割引対象商品にのみバナーを表示
・販売終了間近の商品にのみ特定の文言を表示
といったことも実装いただけます。

■マニュアル レイアウトパーツ
https://www.future-shop.jp/manual/builder/layout-parts.html


また、今回は「テキスト」の表示についてご紹介しましたが
文言ではなく画像のみを貼る場合はフリーパーツではなくコラムパーツも便利です。