• プレミアム
  • ビジネス
  • フリー
  • パソコン
  • スマートフォン

注文画面デザイン

商品の注文画面のデザインを設定(編集)できる画面です。

決済画面の利用設定

決済画面の利用設定

決済画面のデザインを変更できます。
Smart Checkout:注文が1画面で完了する決済画面です。(ゲスト購入の場合は、決済前に注文者情報を入力する画面があります)
旧決済画面:従来からある3画面構成の決済画面です。
※「Smart Checkout」は、未対応の機能をご利用の場合、適用できません。切り替え前に必ずマニュアルをご確認ください。

注文画面の表示設定 ※PC画面のみ適用されます。

注文画面デザイン

  • 1.PCの注文画面の整列形態を設定できます。(デフォルトでは中央寄せが選択されています)
  • 2.注文画面の背景カラーを設定することができます。
    「色選択」というボタンをクリックするとパレットウィンドウが出てきて、216種類の色を選択することができます。
    背景に画像を指定することもできます。
    「ファイルを選択」ボタンから画像を登録することができます。
  • 3ご注文の流れ、注文ステップ画像を設定できます。 ※以下のような別ウィンドウが開きます。


  • 1「オリジナル設定画像」を選択します。
  • 2ステップ1~3で使用する画像をアップロードしてください。
    画像を登録すると図のように登録済みの画像が表示されます。
    ※イメージファイルサイズは200KB以内で作成してください。
    ※イメージファイルはGIF、JPG形式が登録可能です。
  • 3「確認」ボタンをクリックすると反映します。
  • 4注文画面の詳細色設定をおこなうことができます。※以下のような別ウィンドウが開きます。


  • 1項目の表の横幅を設定することができます。
  • 2それぞれの項目の背景や文字色を設定することができます。
  • 3上記の設定が完了しましたら「設定する」ボタンをクリックしてください。(クリックしないと反映されません)
  • ※設定を反映したい際は、必ず管理画面最下位置の「保存」ボタンをクリックしてください。誤った設定をした際には、「初期値に戻す」ボタンをクリックすると、初期状態に戻ります。※PC画面のみ適用されます。

看板画像(画面上部)の表示設定

注文画面デザイン

  • 1決済画面の上部に画像(看板)を設定できます。
    ※PCショップ・スマートフォンショップ共通の設定です。
  • 2PC用ショップに表示したい画像(看板)をアップロードします。
    削除したい場合は「削除する」ボタンをクリックすると削除できます。
    ※注文画面では原寸表示されます。表示イメージは縮小しています。
    ※イメージファイルサイズは200KB以内で作成してください。
    ※イメージファイルはGIF、JPG、PNG形式が登録可能です。
  • 3PC用ショップの画像の整列形式を設定できます。
  • 4PC用ショップの看板の背景色を設定できます。
  • 5スマートフォン用ショップに表示したい画像(看板)をアップロードします。
    削除したい場合は「削除する」ボタンをクリックすると削除できます。
    ※プレミアムプランのみご利用可能です。
    ※注文画面では原寸表示されます。表示イメージは縮小しています。
    ※イメージファイルは横640ピクセル、縦120ピクセル以下を推奨です。
    ※イメージファイルサイズは200KB以内で作成してください。
    ※イメージファイルはGIF、JPG、PNG形式が登録可能です。

フッター画像(画面下部)の表示設定

フッター画像

  • 1決済画面フッター(画面下部)に画像を設定できます。
    ※PCショップ・スマートフォンショップ共通の設定です。
  • 2PC用ショップに表示したい画像(フッター)をアップロードします。
    削除したい場合は「削除する」ボタンをクリックすると削除できます。
    ※注文画面では原寸表示されます。表示イメージは縮小しています。
    ※イメージファイルサイズは200KB以内で作成してください。
    ※イメージファイルはGIF、JPG、PNG形式が登録可能です。
  • 3PC用ショップの画像の整列形式を設定できます。
  • 4スマートフォン用ショップに表示したい画像(フッター)をアップロードします。
    削除したい場合は「削除する」ボタンをクリックすると削除できます。
    ※プレミアムプランのみご利用可能です。
    ※注文画面では原寸表示されます。表示イメージは縮小しています。
    ※イメージファイルは横640ピクセル、縦120ピクセル以下を推奨です。
    ※イメージファイルサイズは200KB以内で作成してください。
    ※イメージファイルはGIF、JPG、PNG形式が登録可能です。

その他の表示設定

設定不可となる項目について

設定不可となる項目について

  • 1注文画面内の商品名をクリックすると商品詳細画面を別ウィンドウで開く 設定にする場合は「設定する」を選択します。
    以下のように商品名にリンクアイコンが表示されます。商品名をクリックすると商品詳細画面を開きます。
    ※PCとスマートフォン画面に適用されます。設定不可となる項目について

注文情報項目表示設定

注文情報項目表示設定

  • 2注文画面内の注文情報に緊急連絡先を表示する場合は、「表示する」を選択すると以下のように表示されます。
    緊急連絡先を表示しない場合は、「表示しない」を選択してください。
    ※PC、スマートフォン画面に適用されます。注文情報項目表示設定
  • 3注文画面内の備考入力フォームを「表示する」、「表示しない」を選択することができます。
    「表示する」…決済画面に備考欄が表示され、購入者は自由に備考内容を入力することができます。
    備考欄に入力があった場合【注文管理】>【注文検索/一括処理】「詳細注文情報」にて入力内容を確認することができます。
    「表示しない」…決済画面に備考欄は表示されません。
    ※PC、スマートフォン画面に適用されます。

    複数配送注文の場合、「表示する・表示しない」の設定に関わらず、注文画面の「お届け先の入力」項目内に備考欄が表示されます。注文情報項目表示設定

注文備考の案内文【ショップ作成】>【決済・注文関連の設定】>【注文画面案内文の設定】

注文備考【ショップ作成】>【配送関連の設定】>【注文/配送備考の設定】
は、備考入力欄とは別で設定することができます。

設定を保存

保存

  • 1上記全ての設定を保存して反映する場合は必ず「保存」ボタンをクリックして反映します。
  • 2「初期値に戻す」ボタンをクリックすると初期値状態に戻ります。

表示例

PCショップ決済画面表示例

PCショップ決済画面表示例

スマートフォンショップ決済画面表示例

スマートフォンショップ決済画面表示例

新決済画面「Smart Checkout」について

「Smart Checkout」は、未対応の機能をご利用の場合、適用できません。切り替え前にかならず以下の内容をご確認ください。

設定が変更となる内容について

旧決済画面からSmart Checkoutへ切り替えた場合、下記の内容が変更されます。
あらかじめご確認ください。

マイページ「アドレス帳」の利用

Smart Checkoutに切り替えると、ショップ会員のマイページで「アドレス帳」 が利用できるようになります。
「アドレス帳」は、注文の際、お届け先の指定に利用できます。

2024/10/9 15:00頃以降、ショップ会員が決済画面でお届け先を「別の住所に送る」とした際に「リストから選ぶ」より自動表示されていた「以前に利用したお届け先」は「アドレス帳」の表示に切り替わります。
また、旧決済画面からSmart Checkoutに切り替えた場合も、ショップ会員が「以前に利用したお届け先を選択する」より選択していたお届け先のリストは利用できなくなります。
これまで利用していたリストが参照できなくなるため、よく使うお届け先を「アドレス帳」に登録する必要があることをあらかじめショップ会員へお伝えください。

設定不可となる項目について

利用可能決済方法と利用制限機能について

新決済画面「Smart Checkout」は順次、対応内容を拡張してまいります。

決済方法について

2024/11/28時点では、以下の決済方法のみに対応しております。
非対応の決済を利用中の場合はアラートが表示され、切り替えがおこなえません。

■対象決済
※決済の「説明文」は全角半角問わず500文字まで表示されます。
HTMLの表示に非対応となるため、テキストのみで入力してください。

  • カード決済(GMOペイメントゲートウェイ・SMBC-GMOペイメント・GMOイプシロン)
  • Amazon Pay
  • 銀行振込
  • 任意決済
  • 代金引換
  • atone
  • GMOイプシロン バーチャル口座
  • GMOイプシロン コンビニ決済
  • NP後払い
  • 後払い.com
  • GMOペイメントゲートウェイ コンビニ決済
  • クロネコwebコレクト カード決済
  • GMOイプシロン キャリア決済
  • GMOペイメントゲートウェイ キャリア決済
  • クロネコwebコレクト 代金後払い
  • クロネコwebコレクト コンビニ決済

※以下の決済方法は、決済の「タイトル」と「説明文」が固定の内容(ロゴと各決済会社推奨の説明文)で表示されます。(注文データやCSVには反映されます)
任意に設定した決済タイトルと説明文は決済画面に反映されません。

  • PayPay
  • LINE Pay
  • あと払い(ペイディ)
  • 楽天ペイ

現在非対応の機能

現在のところ、以下の機能には対応しておりません。
「※1」の機能を利用中の場合はアラートが表示され、切り替えがおこなえません。

  • 外税 ※1
    【ショップ作成】>【決済・注文関連の設定】>【消費税の設定】
  • GMOポイント(アイテムポスト) ※1
    【集客サービス(アイテムポスト)】>【アイテムポストTOP】
  • ASUKA ※1
    【ショップ作成】>【決済・注文関連の設定】>【不正購入防止(ASUKA)】

■有料オプション ※1

  • 定期購入
  • 予約販売
  • 複数ショップ会員連携
  • ケータリング・デリバリーオプション
  • EFO CUBE

設定に制限がある機能

以下の機能には制限があります。必要に応じて修正をおこなってください。

◎配送方法の説明・お届け目安
【ショップ作成】>【配送関連の設定】>【配送の設定】
└配送方法の説明
【ショップ作成】>【配送関連の設定】>【配送日時の設定】
└お届け目安 全角半角問わず500文字まで表示されます。
HTMLの表示に非対応となるため、テキストのみで入力してください。

◎「注文画面「注文備考」入力欄の上に表示する文章」

【ショップ作成】>【決済・注文関連の設定】>【注文画面案内文の設定】
└注文画面「注文備考」
入力欄の上に表示する文章 HTMLの表示に非対応となるため、テキストのみで入力してください。

◎注文備考

【ショップ作成】>【配送関連の設定】>【注文/配送備考の設定】
最大10個まで表示されます。上限より多く登録済みの場合、11個目以降は表示されません。
入力形式「Radio」「Checkbox」利用時、「一行で表示する項目数」の設定は反映されません。
1行1項目で固定表示となります。

◎複数配送

・旧決済画面の『複数配送』とは以下の点が異なります。
└「配送備考」は『複数配送』注文時のみ入力することができます。(通常配送時は表示されません)
└お届け先が1箇所のご注文時は、『複数配送』扱いの注文となりません。

※常時SSLの決済・ログイン画面等の独自ドメイン設定・決済画面のreCAPTCHAには対応しています。

ご利用条件について

新決済画面「Smart Checkout」ご利用には、以下の条件を満たす必要があります。

・購入時、1つ以上の決済方法・配送方法が利用可能な状態であること

設定後に切り替えをおこなってください。
未設定の場合、購入者が決済画面に入る際に下記のエラーが表示され、注文がおこなえません。

「このページに問題が発生しました。ご迷惑をおかけして申し訳ありません。」


なお設定後は、提供するサービス内容等が「特定商取引法」や「個人情報ポリシー」に正しく記載されているかをかならずご確認の上、開店してください。

リリースのスケジュールについて

新決済画面「Smart Checkout」は、フェーズを分けて順次リリースしていく予定です。
詳しくは、お知らせにてご確認ください。

運営ノウハウ集