フォローする

【後会計】モバイルオーダーのレイアウトを登録する

対象プラン

  • スタンダード
  • プレミアム
  • プレミアム
    プラス
  • フード
    ビジネス
  • リテール
    ビジネス

『レイアウト』から、モバイルオーダーでお客様のスマートフォン上に表示されるメニュー画面を設定します。

レイアウトが登録できたら、店舗設定で紐付けを行なってください。

レイアウトを新規作成する

本文中の画像はクリックすると大きなサイズで表示されます
  1. レイアウト画面を表示する
    mo_l_layout_01_01.png
    『モバイルオーダー > 後会計 > レイアウト』とクリックします。
  2. レイアウトの新規作成
    mo_l_layout_01_02.png
    【+新規レイアウト作成】ボタンをクリックします。
    mo_l_layout_01_03.png

    レイアウトを設定する店舗を選択し、【決定】ボタンをクリックします。

  3. レイアウト設定を開始する
    mo_l_layout_01_04.png

    『新規モバイルオーダー(for Waiter)レイアウト』画面の『基本設定』が表示されます。

    『レイアウト名称』項目に、設定するレイアウトの名称を入力します。

    mo_l_layout_01_05.png

    『チェックアウト画面』をクリックします。

    『チェックアウト文言』項目にチェックアウト時に表示されるテキストを入力します。

    『レイアウト名称』と『チェックアウト文言』は入力必須の項目です
  4. レイアウト設定を作成する
    mo_l_layout_01_06.png

    必須項目が入力できたら、画面右下の【保存】ボタンをクリックします。

    確認のメッセージが表示されるので、【はい】ボタンをクリックします。

    mo_l_layout_01_07.png

    レイアウト一覧画面へ戻り、『データ登録成功 レイアウトが作成されました。』と表示され、一覧にレイアウト設定が作成されていることが確認できます。

    以上でレイアウトの新規作成は完了です。
    基本設定の詳細や、商品の選択を行なってください。

基本設定

本文中の画像はクリックすると大きなサイズで表示されます
  1. 基本設定の編集を行なうレイアウトを選択する
    mo_l_layout_02_01.png

    『モバイルオーダー > 後会計 > レイアウト』からレイアウト一覧画面を表示します。

    一覧から任意のレイアウトをクリックします。

    mo_l_layout_02_02.png

    『基本設定』が表示されます。

    使用店舗
    表示しているレイアウトを使用する店舗です。
    レイアウト名称
    レイアウト一覧に表示される名称です。
    店舗設定でレイアウトを選択する場合もこちらの名称で表示されます。
    利用店舗
    モバイルオーダー画面の基本カラーを設定します。
    画面上のボタンやベースのカラーが変更されます。
    テーマ色
    モバイルオーダー画面の基本カラーを設定します。
    画面上のボタンやベースのカラーが変更されます。
    使用言語
    チェックを入れた言語へ切り替え可能になります。
    タブ、商品名などのすべて項目に、対応する言語の登録が必要です
  2. 設定を保存します
    mo_l_layout_02_03.png

    必須項目が入力できたら、画面右下の【保存】ボタンをクリックします。

    確認のメッセージが表示されるので、【はい】ボタンをクリックします。

    mo_l_layout_02_04.png

    レイアウト一覧画面へ戻り、『データ更新成功 レイアウトが更新されました。』と表示されます。

    基本設定の保存は完了です。

モバイルオーダー端末で表示するメニューを登録します。

モバイルオーダーでは、メニューを『タブ』と『ボタン』で管理しています。
【タブ】
モバイルオーダーにおけるカテゴリーに該当します。
ウェイターに登録されているカテゴリーは考慮せず、自由にメニューを登録できます。
【ボタン】
モバイルオーダーのメニュー表示に該当します。
タブごとに設定し、メニューを注文する際の選択ボタンとして動作、サイズや画像の有無などを自由に設定できます。

登録するタブの数 / タブの名称 / タブに設定するメニュー / ボタンの配置や大きさ / ボタンに登録する画像 など、情報設計を事前にある程度決めてから設定を行なうことをお勧めいたします。

本文中の画像はクリックすると大きなサイズで表示されます
  1. 商品選択画面の編集を行なうレイアウトを選択する
    mo_l_layout_03_01_01.png

    『モバイルオーダー > 後会計 > レイアウト』からレイアウト一覧画面を表示します。

    一覧から任意のレイアウトをクリックします。

    mo_l_layout_03_01_02.png
    『商品選択画面』をクリックします。
  2. タブの登録
    mo_l_layout_03_02_01.png
    タブ一覧の【追加】をクリックします。
    mo_l_layout_03_02_02.png
    mo_l_layout_03_02_03.png

    『タブ追加』画面が表示されます。

    タブ名
    管理画面のタブ一覧や、モバイルオーダー端末に表示されるタブの名称です。
    モバイルオーダー端末上では、タブに登録した商品を選択します
    プラン
    プラン(食べ放題 / 飲み放題 など)を設定する場合、こちらで対象のプランを選択します。
    『プラン』を選択しなければ、通常メニュー用として登録されます。
    設定可能なプランがある場合、『プランを選択』をクリックすると一覧が表示されるので選択してください。
    背景色
    モバイルオーダー端末上の該当タブの背景色を設定します。
    mo_l_layout_03_02_04.png
    タブ一覧に登録したタブが表示されます。
    タブの追加
    上記までの手順を繰り返し、モバイルオーダー端末に表示させる分のタブを登録してください。
    タブの並び替え
    タブを選択し、ドラッグ&ドロップで並び替えが可能です。
    タブの編集 / 削除
    編集 / 削除を行なうタブを選択し、右端の編集アイコンをクリックします。
    『タブ編集』ウィンドウが表示されるので、必要な処理を実行してください。
    『プラン』の内容は変更できません
  3. タブにメニューを追加する(行の追加)
    mo_l_layout_03_03_01.png
    mo_l_layout_03_03_02.png

    メニューを追加するタブを選択します。

    行の追加
    【+ 行を追加】をクリックするごとに、1行(6マス)追加されます。
    行の削除
    なにも登録されていない行のみ、行の左側に『削除』のボタンが表示されます。
    不要な場合は削除してください。
    未登録状態の行が複数ある場合、最下部のみ『削除』が表示されます
  4. タブにメニューを追加する(商品の追加)
    mo_l_layout_03_04_01.png
    追加行の、なにも登録されていないマスをクリックします。
    『+ 追加』と表示されるマスです
    mo_l_layout_03_04_02.png

    『メニューアイテム追加』画面が表示され、【商品 / テキスト / 画像】から種別を選択して登録できます。

    商品
    【通常メニュー用のタブ】
    ウェイターに登録されている『単品メニュー』から選択して追加できます。
    【プラン用のタブ】
    設定されたプランの『プラン内メニュー』から選択して追加できます。
    テキスト
    ご案内や説明などを任意のテキストで追加できます。
    画像
    イメージ画像やメニュー説明の画像を登録できます。
    タブを指定したリンクの追加が可能です。
    上記一覧の項目名から、それぞれの詳細説明へリンクしています
    メニューアイテム追加【商品】
    mo_l_layout_03_04_05.png
    項目名 説明
    商品 【商品選択】をクリックすると、単品メニューの一覧が表示されます。
    タブに追加するメニューを選択してください。
    商品名 選択されているメニューのウェイターでの登録名が表示されます。
    商品表示名 モバイルオーダー端末にメニューとして表示されるテキストです。
    任意の名称へ変更可能です。
    『非表示』にする場合、画像の登録が必須になります
    文字サイズ 『商品表示名』項目で登録したテキストの表示サイズを設定できます。
    商品単価 選択されているメニューの単価が表示されます。
    キャッチコピー メニューの紹介や簡単な説明文を設定できます。
    商品画像

    メニューの画像を設定できます。
    画像はメニューのボタンサイズによって表示可能な形状が変動するので、ボタンサイズの変更後に登録してください。

    メニューボタンの変更について、詳細は下記のリンクからご確認ください
    ボタンサイズの変更 / 画像の登録

    ボタン色 メニューボタンの枠の色を設定できます。
    トッピンググループ名 選択されているメニューにトッピンググループが設定されている場合、対象のトッピンググループが表示されます。
    メニューアイテム追加【テキスト】
    mo_l_layout_03_04_06.png
    項目名 説明
    テキスト内容 任意の文字列を登録できます。
    テキストは太字の黒、センター配置のみとなります。
    文字の色、配置の設定などは行なえません
    文字サイズ 『テキスト内容』項目で登録したテキストの表示サイズを設定できます。
    メニューアイテム追加【画像】
    mo_l_layout_03_04_07.png
    項目名 説明
    画像 画像だけを登録できます。
    画像はメニューのボタンサイズによって表示可能な形状が変動するので、ボタンサイズの変更後に登録してください。

    メニューボタンの変更について、詳細は下記のリンクからご確認ください
    ボタンサイズの変更 / 画像の登録

    リンク 【あり】を選択すると、遷移先のタブを指定できます。
    タブ以外は設定できません
    mo_l_layout_03_04_08.png
    mo_l_layout_03_04_09.png
    メニューが追加されます。
    メニューボタンの位置変更

    メニューボタンを選択し、ドラッグ&ドロップで並び替えが可能です。
    選択しているボタンのサイズに合わせて、移動先も同じサイズのスペースが必要です。

    行の追加、対象外のボタンの位置調整などを行ない、ご希望の配置へ調整してください。
    メニューの編集 / 削除

    対象のメニューを選択し、ダブルクリックします。
    ボタンに表示される『編集』のテキストをクリックすると、『メニューアイテム編集』画面が表示されます。

    ボタンの大きさ変更などについては以下のリンクをご確認ください。
    ボタンサイズの変更 / 画像の登録

    【編集】
    必要な編集を行なったら【完了】ボタンで終了します。
    『プラン』の内容は変更できません(プランあり → なし など)
    【削除】
    編集画面の【削除】ボタンをクリックします。
    【削除】をクリックした時点で削除が実行されますが、レイアウトの保存を行なう前であれば操作の取消が可能です
  5. 設定を保存します
    mo_l_layout_03_04_11.png

    メニューを追加したら、画面右下の【保存】ボタンをクリックします。

    確認のメッセージが表示されるので、【はい】ボタンをクリックします。

    mo_l_layout_02_04.png

    レイアウト一覧画面へ戻り、『データ更新成功 レイアウトが更新されました。』と表示されます。

    以上で商品選択画面の保存は完了です。

    必要に応じて、ボタンサイズの変更 / 画像の登録を行なってください。

ボタンのサイズを変更する

モバイルオーダーに表示されるメニューボタンはマスに合わせて自由にサイズを変更できます。
小さいサイズで多くのメニューを並べたり、画像や説明付きで大きな1枚を表示させるなど、店舗に合わせて設定してください。
メニューボタンに画像を設定する場合、こちらのサイズ変更を先に行なってから追加するようにしてください
本文中の画像はクリックすると大きなサイズで表示されます
  1. 対象のメニューを選択する
    mo_l_layout_07_01.png

    ボタンのサイズを変更するメニューを選択し、ダブルクリックします。
    ボタンに『編集』と『右下角に白い丸』が表示されます。

  2. サイズを変更する
    mo_l_layout_07_02.png

    『右下角の白い丸』にマウスカーソルを合わせると、左上と右下を指した矢印に形が変わります。
    その状態でクリックしたままカーソルを移動させるとボタンのサイズを変更できます。

    サイズを大きく変更させる場合、必要な分のなにも登録されていないマスが必要です。

    必要に応じて行の追加やほかのボタンの移動を行なってから実行してください
    mo_l_layout_07_03.png

    『縦2マス 横2マス』サイズのメニューボタンを2つ並べたイメージです。

    同じサイズのボタンを3つ並べることもできますし、『縦2マス 横1マス』を2つ追加して4つのメニューを並べることも可能です。

メニューに画像を登録する

モバイルオーダーに表示されるメニューボタンに画像を登録し、メニューのイメージを表示したり、オリジナルの説明を追加することが可能です。
小さいボタンの場合は表示される画像も小さいので、ある程度大きめのボタンを設定することをお勧めします。
メニューボタンに画像を設定する場合、先にボタンのサイズを確定してから追加するようにしてください
画像登録後にボタンのサイズを変更すると、画質が荒くなったり、表示される画像の位置がズレてしまう場合があります
本文中の画像はクリックすると大きなサイズで表示されます
  1. 対象のメニューを選択する
    mo_l_layout_05_01.png

    画像を登録するメニューを選択し、ダブルクリックします。
    ボタンに表示される『編集』のテキストをクリックします。

    mo_l_layout_05_02.png

    メニューアイテム編集画面が表示されます。
    『商品画像』項目を【あり】に変更し、『アップロード』をクリックして対象メニュー用の画像を追加してください。

    アップロード可能なファイル
    【ファイルサイズ】2MB以下
    【形式】JPG / GIF / PNG
    GIFアニメを設定しても動きません(画像として登録はされます)
  2. 画像の調整
    mo_l_layout_05_03.png

    画像を調整する画面が表示されます。

    青い枠は『ボタンに表示される画像』の範囲で、対象のボタンに合わせた枠が自動で表示されます。

    画像下のバーで『画像の拡大』が行なえます。

    画像はドラッグして位置の調整が可能です
    ②のバーで大きさを調整し、①の表示枠に合わせて適切な位置で設定してください

    大きさや位置が確定したら、【完了】ボタンでトリミング画面を閉じてください

    画像のトリミングは登録時にのみ行なえます
  3. 編集を完了する
    mo_l_layout_05_04.png

    商品画像の表示イメージが確認できます。

    画像を修正する場合、画像左下の『ゴミ箱アイコン』から画像を削除し、アップロードとトリミングを再度実行してください

    【完了】ボタンをクリックすると、商品選択画面へ戻ります。

    mo_l_layout_05_05.png

    商品選択画面でモバイルオーダーに表示されるメニューボタンの状態を確認してください。

  4. 設定を保存します
    mo_l_layout_05_06.png

    画面右下の【保存】ボタンをクリックします。

    確認のメッセージが表示されるので、【はい】ボタンをクリックします。

    mo_l_layout_02_04.png

    レイアウト一覧画面へ戻り、『データ更新成功 レイアウトが更新されました。』と表示されます。

    以上で画像の登録は完了です。

チェックアウト画面

お客様の端末でチェックアウトを行なった際の設定をします。
本文中の画像はクリックすると大きなサイズで表示されます
  1. チェックアウト画面の設定をします
    mo_l_layout_04_01.png
    モバイルオーダー端末でチェックアウトした後の画面で表示される文言を登録します。
  2. 設定を保存します
    mo_l_layout_04_02.png

    文言を入力したら、画面右下の【保存】ボタンをクリックします。

    確認のメッセージが表示されるので、【はい】ボタンをクリックします。

    mo_l_layout_02_04.png

    レイアウト一覧画面へ戻り、『データ更新成功 レイアウトが更新されました。』と表示されます。

    以上でチェックアウト画面の保存は完了です。

多言語設定

モバイルオーダーは複数言語対応が可能ですが、それぞれのメニューごとに対応言語に登録が必要です。
メニューに対応させる言語を登録後、基本設定の『使用言語』で対象の言語にチェックを入れてください。
メニューに対象の言語が登録されていない場合、モバイルオーダーで使用言語を切り替えても日本語のまま表示されます
本文中の画像はクリックすると大きなサイズで表示されます
  1. 設定を行なうメニューを選択する
    mo_l_layout_06_01.png
    多言語設定を行なうメニューをダブルクリックし、『編集』をクリックします。
  2. 設定項目の表示
    mo_l_layout_06_02.png
    メニューアイテム編集画面で【多言語設定】をクリックします。
    『商品』の場合
    『商品表示名』項目の【多言語設定】をクリックします。
    『テキスト』の場合
    『テキスト内容』項目の【多言語設定】をクリックします。
    『画像』の場合
    『画像』項目の【多言語設定】をクリックします。
  3. 多言語情報の入力
    mo_l_layout_06_03.png

    『商品』と『テキスト』の場合、対象言語への切り替え後に表示させるメニュー名やテキストを登録します。

    『画像』の場合、対象言語への切り替え後に表示させる画像を登録します。
    言語ごとに登録した画像が表示されます

    【完了】ボタンをクリックすると、メニューアイテム編集画面へ戻ります。

    この時点ではまだ多言語設定の登録内容は確定していません、『メニューの保存 > レイアウトの保存』の実行後にモバイルオーダーへ反映されます
この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています
他にご質問がございましたら、リクエストを送信してください
このページの先頭へ
AIチャットを利用する
スマレジ サポート
※ヘルプ内の最新情報がチャットの回答に反映されるまで、時間がかることがあります(24時間周期でヘルプ内を学習)
※AIによる自動生成のため、内容に誤りが含まれる場合があります