運用サポート(平日10:00~17:00) 06-6485-6485
コマースクリエイター未利用コマースクリエイター移行中(有効)コマースクリエイター利用中説明を表示 ▼

任意商品表示パーツ追加・変更

×

マニュアル閲覧上の注意

店舗の状態にあわせて、上のボタンからいずれかを選択してください。表示される項目が変更されます。

コマースクリエイター未利用
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター移行中(有効)
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター利用中
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を新規構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

上記のボタンは再選択できます。店舗の状態がわからない方はコマースクリエイターご利用状況の確認方法についてをご覧ください。

コマースクリエイター>パーツ>任意商品表示パーツ

パーツ一覧より任意商品表示パーツで作成されたパーツのボタン、
もしくは[パーツを追加する]ボタンより任意商品表示パーツを選択すると遷移します。

商品番号を登録するだけで、商品を横に並べて表示できます。

20商品まで登録できます。
カルーセル形式で横にスライド(フリック)できます。

パーツについての解説と利用方法については、パーツ一覧-パーツとはをご覧ください。

スタートアップテーマでは、フリーパーツで作成したパーツがすでにサンプルとして準備され、レイアウトに配置されています。利用方法などの参考として、管理画面内にてご覧ください。

スタートアップテーマでの利用例(一部)

  • 売れ筋商品
  • 新着アイテム
  • おすすめ商品

※配置されているパーツの一覧はスタートアップテーマのご利用方法をご覧ください。

目次

任意商品表示パーツで表示されない商品について

任意商品表示パーツでは、以下の商品は表示されません。

  • 非公開の商品・削除済みの商品
  • 在庫切れ(予約の場合は予約在庫切れ)の商品 ※在庫設定を行っている商品のみ
  • 予約受付期間外の予約商品
  • 販売期間外の商品
  • ゲストの場合に、会員のみアクセス可とする商品
  • 「闇市グループ」に登録されている商品
  • 定期・頒布会商品で、「定期・頒布会在庫数」設定をしており、申込上限に達している商品

表示できる商品がない場合や商品番号が登録されていない場合は、任意商品表示パーツは表示されません。

プレビューの場合

<動作確認モード>
上記と同様です。

<デザイン確認モード>
非公開商品は表示されます。その他は上記と同様です。

オプションを設定する

パーツを囲むタグ(HTML要素とid/class)や管理タグなどを設定するパーツオプション設定へ遷移します。

[オプションを設定する]ボタン
オプション設定ダイアログ
備考の表示場所
HTML要素
HTMLタグは、パーツを囲むwrapタグを設定できます。
div・article・section・nav・aside・header・footerタグのいずれか、または「指定なし」から選択してください。
id/classを指定する場合は、「指定なし」以外のいずれか選択してください。
id
HTML要素のid属性の値を設定できます。
class
HTML要素のclass属性の値を設定できます。
管理タグ
管理タグ追加・変更-管理タグ活用のポイントをご覧ください。
備考
パーツの用途や表示画面などを入力すると管理がしやすくなります。

パーツ名

パーツの名称を設定できます。

置換文字

パーツ置換文字が表示されます。
パーツ置換文字は複製・追加時に設定できます。一度設定すると変更はできません。

置換文字の活用方法

フリーパーツに、置換文字を記述すると読み込まれます。
変更や修正を加える際、該当のフリーパーツを一つ作業するだけで置換文字を記述した他のすべてのパーツに反映されるので、運用のミス防止や効率化につながります。

フリーパーツ-パーツ置換文字の活用方法もご参照ください。

置換文字

class

パーツにclassを追加できます。ECサイト画面に出力されます。

商品番号

パーツに表示したい商品の商品番号を1商品ずつ改行して入力してください。最大で20商品まで登録できます。
任意商品表示に商品を表示するには、あらかじめ運用>商品管理>商品新規登録・商品基本情報編集にて商品を登録する必要があります。

表示パターン

表示パターンをA・B・Cのいずれか選択してください。表示項目がそれぞれ違います。
※商品種類(通常商品/通常・定期商品/定期商品/頒布会商品)ごとに表示項目が異なりますので、下表をご覧ください。

表示パターンA
カートボタンが表示されます。商品価格などご注文に必要な情報も表示されます。
ただし、通常・定期商品/定期商品/頒布会商品の場合は[詳細を見る]ボタンが表示されます。カートボタンは表示されません。
パターンA

配置場所に関する注意事項

表示パターンAにはformタグが含まれています。
そのためformタグを含む以下のシステムパーツのレイアウト配下には、配置しないでください。

配置しますと、「カートボタンが動作しなくなる/カートに商品が入らない」「数量がエラーが表示される」などの現象が起こります。
パターンAを使用する場合は、以下のシステムパーツグループの外(上の階層)に配置してください。

「商品詳細」画面のレイアウト配置NG例
表示パターンB
お気に入りボタンと商品価格は表示されますが、カートボタン([詳細を見る]ボタン)は表示されません。
パターンB
表示パターンC
お気に入りボタンと商品価格は表示されますが、商品名などは表示されません。表示項目が少ない、シンプルな表示です。
パターンC
表示項目 通常商品 通常・定期商品 定期商品 頒布会商品
A B C A B C A B C A B C
キャッチコピー - - - -
商品画像(リンク)
商品名(リンク) - - - -
商品マーク - - - -
バンドルマーク - - - - - - - - - -
予約商品マーク - - - - - - - - - -
クール便マーク - - - -
通常・定期商品マーク - - - - - - - - - -
定期商品マーク - - - - - - - - - -
頒布会商品マーク - - - - - - - - - -
初回特別価格ありマーク - - - - - -
お届けサイクルマーク - - - - - -
商品一覧予約商品メッセージ - - - - - - - - - - -
定価 - - - - - - - - - -
販売価格 - - - - - -
予約販売価格 - - - - - - - - -
会員価格マーク - - - - - -
会員価格/会員ステージ価格 - - - - - -
定期商品価格(通常回価格) - - - - - -
予約受付期間 - - - - - - - - - - -
販売期間 - - - - - - - -
商品一言説明 - - - - - - - -
在庫切れ僅少コメント/在庫数 - - - - - - - -
入出荷予定日 - - - - - - - - - - -
カートに入れるボタン - - - - - - - - - - -
お気に入り登録/解除
詳細を見る(商品詳細ページへ)ボタン - - - - - - - -

※表示パターンB・Cでは、会員ログイン状態のときに会員価格が登録されていれば会員価格が、なければ販売価格が表示されます。

ボタン・商品マークの表示条件

[カートに入れる]ボタン、[詳細を見る]ボタン

  • 通常商品の場合
    [カートに入れる]ボタン、[詳細を見る]ボタンのいずれか一方が表示されます。
  • 項目選択肢やオプション価格が設定された商品の場合
    [詳細を見る]ボタンが表示され、[カートに入れる]ボタンは表示されません。
  • バリエーション商品の場合
    [詳細を見る]ボタンが表示され、[カートに入れる]ボタンは表示されません。
  • 通常・定期商品/定期商品/頒布会商品の場合
    [詳細を見る]ボタンが表示され、[カートに入れる]ボタンは表示されません。

会員価格設定商品マーク

設定>商品・商品グループ>商品ページ設定-会員価格表示設定-会員価格設定商品マーク設定「商品詳細に表示する」構築>ページ設定>商品ページ設定-価格表示設定-会員価格表示設定-商品一覧-会員価格設定商品のマークをつけるにチェックがある場合に表示されます。

定期・頒布会商品マーク

設定>商品・商品グループ>商品ページ設定-商品設定-定期・頒布会商品マーク表示設定「定期・頒布会商品に「定期・頒布会商品マーク」を表示する」構築>定期・頒布会設定>定期・頒布会ページ設定-商品ページ-定期・頒布会商品マーク表示設定「「定期・頒布会商品マーク」を表示する」にチェックがある場合に表示されます。

初回特別価格ありマーク

運用>商品管理>商品情報(定期・頒布会設定)-商品価格-定期・頒布会販売価格(初回)を設定している場合に表示されます。

クール便マーク

設定>商品・商品グループ>商品ページ設定-商品設定-クール便マーク表示設定「クール便対象商品に「クール便マーク」を表示する」構築>ページ設定>商品ページ設定-商品設定(コマースクリエイター)-クール便マーク表示設定にチェックがある場合に表示されます。

保存する

パーツを保存します。

キャンセルする

未保存の作業内容を破棄します。

削除する

[任意商品一覧を削除する]ボタンを押下すると、任意商品表示パーツを削除を削除できます。削除したパーツは復元できません。
任意商品表示パーツを追加する(新規作成)場合には表示されません。

戻る

レイアウト設定から直接パーツを変更する場合にのみ表示されます。
押下すると、レイアウト設定に戻ります。
未保存の作業内容は破棄されます。
保存するボタンを押下した後、[戻る]ボタンを押下してください。

レイアウト設定から直接パーツを変更する方法については、パーツ配置エリア上からパーツを変更するをご覧ください。

項目表示について

各項目は「以前からのECサイト用」「コマースクリエイター用」「共通」の3種類があります。「コマースクリエイター移行中(有効)」選択時は全ての項目と説明が表示されます。

・以前からのECサイト用項目(コマースクリエイターでは使用しない):右側にこちらの色の点線が表示されます。

・コマースクリエイター専用ECサイト用の項目(以前からのECサイトには影響しない):右側にこちらの色の点線が表示されます。

・上記以外は共通で使用する項目です。(何も表示されません。)

×

店舗の状態にあわせて、下のボタンからいずれかを選択してください。

コマースクリエイター未利用 コマースクリエイター移行中(有効) コマースクリエイター利用中
コマースクリエイター未利用
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター移行中(有効)
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター利用中
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を新規構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

再度選択できますので、店舗の状態がわからない方はいったん「有効」をお選びください。
詳しくはコマースクリエイターご利用状況の確認方法についてをご覧ください。