飲食店のメニューページを作る｜写真・価格・売切れを更新する

完成するものと対象範囲

飲食店のメニューをスマホで読みやすく掲載し、料理名・価格・提供時間を更新できるページにします。紙のメニューを写真一枚で載せるだけにせず、主要な情報は文字でも読めるようにします。紹介ページと注文受付を混同せず、必要な機能を選びます。

写真は料理を選ぶための補助として使い、全品を同じ大きさの画像で埋め尽くさないようにします。看板料理や季節料理を中心に、実際の一人前が分かる構図を選びます。画像が読み込まれなくても料理名、説明、価格を読めることを確認してください。写真と現在の盛り付けが違うときは画像を更新するか、店舗が伝えたい差を本文で説明し、古い宣材を放置しないようにします。

項目と保存先を準備する

入力と保存先に用意する項目は、料理ID、料理名、説明、価格と単位、提供時間、写真、公開状態、更新担当です。元の値と担当者が確認した値は区別し、同じ名前の列を別の意味へ使い回さないようにします。実運用の情報を入れる前に、練習用の識別子で一件を作成し、必要な担当者だけが参照・編集できる保存先を選びます。

価格の更新は店内の表示と同じタイミングで行う担当を決めます。セットに含まれる品と別料金の追加を分け、日替わりや時価の料理を固定価格のように載せないようにします。売切れを知らせるだけなら通常ページの案内でも対応できますが、注文を受けるなら注文アプリ側の受付可能状態も点検します。メニューアプリと注文機能の設定を一つの状態だと思い込まないことが大切です。

設定を順に進める

昼食・夕食・飲み物など来店客が探す区分を決めます。Wix Restaurants Menus等を使うならメニュー、セクション、料理の順に整理し、通常ページで作るなら同じ情報項目を揃えます。表示だけか、注文も受けるかを導入前に決めます。

料理名と価格は文字で掲載し、一人前、セット、追加料金などの単位を付けます。写真は実際の提供内容と合うものを選び、料理の情報を画像内だけに埋め込みません。食材や対応条件は店舗が確認した内容だけを記載します。

売切れや季節終了のときの更新方法を決めます。メニュー表示アプリと注文機能では公開状態や在庫表示の意味が異なるため、公開ページで確認します。スマホで分類を切り替え、拡大せず価格と説明を読めるかを見ます。

少数のデータで確かめる

昼の定食三品と飲み物四品を載せる例で、季節料理だけを非表示にします。料理の順番と価格の単位が崩れず、紙メニューや店頭表示と一致するかを確認します。注文を受けないサイトなら、購入できると誤解するボタンを置かないようにします。

運用中の変更を扱う

公開前は料理数が少ない場合と多い場合の両方で、分類の移動と読みやすさを確かめます。画像の容量を抑え、文字に十分な濃さを持たせ、価格の列を小さくし過ぎないようにします。店内のQRコードから開く場合は、来店客のスマホと回線で表示を確認します。紙メニューの差替え時には、QRコードの参照先や古いPDFのリンクが残っていないかも合わせて確認します。

費用と利用量を見積もる

メニュー紹介だけか、ネット注文や予約も行うかで必要な契約が変わります。Wixのサイト契約、独自ドメイン、注文関連の機能や決済費用を分けて確認してください。写真の差替えや季節の価格変更を誰が行うかも決め、制作初期だけでなく月々の更新時間を見積もります。料理数が少ない段階で使わない販売機能を追加せず、実際の注文経路に必要な構成から始めます。

不具合が出たときの確認

古い価格が残った場合は、画像、通常本文、メニューアプリのどこに値があるかを探します。同じ内容を複数箇所へ手入力すると更新漏れが出るので、管理元を決めます。紙メニューのPDFを残す場合も、主要情報のHTML表示を別に用意します。

運用を始める前の確認

公開・運用前の確認では、通常の一件だけでなく、必須項目が欠けた一件、同じ識別子を再利用した一件、確認後に内容を変更した一件を分けて試します。特に「料理ID」が元の記録へ戻る手掛かりになり、来店客が料理と価格をスマホで読め、更新担当が売切れや変更を反映できるという条件を満たすか確認してください。結果を担当者と共有し、どの入力をどの状態へ残すかが説明できてから対象を広げます。

写真の代替テキストは、料理の見た目や内容を必要な範囲で説明し、価格や営業時間など変わりやすい情報を画像へまとめないようにします。価格は管理する文字項目を正とし、写真ファイル名から推測させません。練習では画像が一枚ない料理を作り、説明と価格だけでも注文や来店の判断に必要な情報が読めるか確認します。空いた画像枠を別料理の写真で埋めると内容を誤解させるため、画像なしでも整うレイアウトを用意します。料理を追加した後は区分の先頭と末尾の両方をスマホで確認します。

• Wixの機能と選び方
• 小規模事業のサイト制作
• ShopifyとWixの比較