スマートフォン用のお店ページを作り込む①
-商品ページ-

1 商品ページを作り込む

商品ページのパーツを編集していきます。必要なパーツのご案内だけご確認ください。
また、パソコン用お店ページに表示しているパーツをまだ追加していなければ、クリックして追加した上で編集してください。 ここではPCページと連動する設定になっているパーツは、他のページでご案内するので省略します。

■「カートに入れるボタン」のパーツを編集します

商品をカートに入れるためのボタンを表示するパーツです。

  1. 1つ下のカテゴリ一覧の「編集」ボタンをクリックします。
    編集画面が開きます。
  2. カートに入れるボタンをタップした時の挙動を決めます。
    「カート画面に遷移する」を選ぶと、タップ時にカート画面に遷移します。 「商品ページにとどまる」を選ぶと、画面は商品ページのまま「商品を追加しました」というメッセージがポップアップで表示されます。

    カートをみるボタンを「表示する」
    ポップアップ内に「カートをみる」「買い物を続ける」のボタンが表示されます。

    カートをみるボタンを「表示しない」
    「商品を追加しました」というメッセージのみが表示され、1秒ほどで自動的に消えます。


    独自ドメインカートを利用していない場合、「商品ページにとどまる」はiphone、ipadなどのiOS端末を除きます。またMacOSも同様です。これらの場合はカート画面に遷移します。




  3. カートに入れるボタンに表記する名称を入力します。
    「カートに入れる」のままでも問題ありませんが、「カートへ」「カゴへ」 「購入する」など、違う名称にしたい場合は修正します。
  4. バリエーションやオプションなどの必須項目があれば、選択するまで 「カートに入れる」ボタンを押せなくすることができます。
  5. 「プレビューに反映する」ボタンをクリックして、編集画面を閉じます。
  6. 画面右上の「お店ページに反映する」ボタンをクリックします。

■「関連商品」のパーツを編集します

商品に紐づけた関連商品を表示するパーツです。

  1. 関連商品の「編集」ボタンをクリックします。
    編集画面が開きます。
  2. 関連商品コーナーにつける「見出し」を入力します。
    「この商品をチェックした人はこんな商品も見ています」や「その他の オススメ商品」など、お客さんを離脱させずに他の商品に誘導できる 名称をつけます。
  3. 商品の並べ方を選びます。
    「開閉あり」にすると、ページ表示した際は見出しだけ表示し、見出しをクリックすると関連商品の一覧が表示されます。「開閉なし」だとあらかじめ一覧が表示されます。
  4. 表示したい項目にチェックを入れます。

    商品名:
    商品の名前を表示します。

    商品画像:
    商品の画像を表示します。

    商品説明(内部用キャッチコピー):
    商品説明を表示します。表示する内容は、スマートフォン(オプショ ン)用内部用キャッチコピー を表示します。

    販売価格:
    商品を実際に販売する価格を表示します。商品一覧の時点では価格 を表示したくなければチェックを外します。

    定価と割引率:
    二重価格表示をする際にチェックします。

    レビューの平均値:
    お客様の声の平均値を表示します。

  5. 関連商品に表示する商品の数を選びます。
    12件まで選べます。
  6. 「プレビューに反映する」ボタンをクリックして、編集画面を閉じます。
  7. 画面右上の「お店ページに反映する」ボタンをクリックします。

■「購入者のレビュー」のパーツを編集します

お客様の声を表示するパーツです。
該当商品に関するお客様の声のみ表示します。

  1. 購入者のレビューの「編集」ボタンをクリックします。
    編集画面が開きます。
  2. 購入者のレビューコーナーにつける「見出し」を入力します。
    PC 用お店ページの「お客様の声」と同じものです。
    PC 用管理画面の、 管理画面メニュー「 ページ編集 > コンテンツの編集 > 評価ページの設定 > タイトル」 や、 管理画面メニュー「 デザイン設定 > トップページ > ヘッダとSEOの設定 > お客様の声」と、 同じ名称を入力すれば、名称を統一できます。
  3. 「プレビューに反映する」ボタンをクリックして、編集画面を閉じます。
  4. 画面右上の「お店ページに反映する」ボタンをクリックします。

■「パンくず」のパーツを編集します

  1. パンくずの「編集」ボタンをクリックします。
    編集画面が開きます。
  2. パンくずの表示をメインカテゴリだけに留めるか、複数カテゴリ表示とするかを選びます。

    また、HOME 欄はパンくずの先頭文字列です。
    例えば「トップページに戻る」と入力すると、「トップページに戻る > カテゴリ名」のようにパンくずを表示します。
    未入力のままだと「TOP」となります。
    URL欄は、HOME の文字列のリンク先URLです。
  3. 「プレビューに反映する」ボタンをクリックして、編集画面を閉じます。
  4. 画面右上の「お店ページに反映する」ボタンをクリックします。