【新型コロナに負けるな!】オンライン受注・テイクアウトを受け付ける専用サイトを最短&無料で構築しよう!

はじめに

みなさんこんにちは、フットでディレクターとエンジニアをしています岡村です。

新型コロナウイルス感染症対策の一環として店舗販売を制限したり、接客を必要とする事業主様は休業を余儀なくされたりと大変な状況ではありますが、私達ができることで少しでも地域に対してサポートができないかと考えました。

特に飲食業界ではテイクアウトやデリバリーを初められた店舗も増えていると伺っています。ですが、そのための情報発信ができておらず、認知されていない状況もあると聞いています。

現時点でホームページを持っていない店舗もあると思いますし、すでにホームページを持っていても、情報を集約して発信するには時間やコストがかかってしまうケースもあるのではないでしょうか。

そこで、私達としては、今あるサービスを活用し、なるべく簡単でコストもかけずに、そういった情報発信ができる方法をご紹介することで、サポートしたいと思います。

飲食に関わらず、店舗販売をされている小売店様や、対面での商談を必要とされる企業様でも手軽にホームページを作成できて情報発信ができたらいかがでしょうか。

すでにいくつかの企業様や有志の方により、デリバリーやテイクアウト情報をまとめた記事を公開されたり、ポータルサイトを企画されているというのも聞いていますが、まずはご自身でやってみても良いかも知れません。
もちろん、躓く所があれば私達の時間の許す限りサポートさせて頂ければと思います!

必要な環境

  • インターネットに接続されたパソコン
    (スマートフォンやタブレットでも可能ですので、ご自身が使い勝手の良い環境をご利用ください)
  • インターネットブラウザ
    (一般的に普及しているブラウザであればほぼ問題なく動作すると思いますが、利用するGoogleのサービスとの相性も良いので、Google Chromeが一番良いかと思います)

なお、本記事ではパソコンでGoogle Chromeを使用してご説明しています。お使いの環境によっては画面の見え方が若干異なる場合がありますので、ご了承ください。

Googleアカウントを作成する

まずは、Googleの各種サービスを利用するため、アカウントを作成します。

スマートフォンを使用している方ですと、Gmailなどのサービスを使用しているとおもいますので、アカウントをすでにお持ちの場合もあるかと思いますが、お店や企業用に使用しますので、なるべく個人のアカウントは使用せず新たにアカウントを作成した方が良いと思います。

以下のリンクをクリックすると、Google アカウントの作成ページが開きますので、必要な情報を入力し、アカウントを作成します。

Google アカウントを作成する

大まかな流れは以下のようになります。

ステップ1

  • 性、名を入力(例:ホカホカ弁当の フット)
  • ユーザー名(例:obentou.foot)
    • この場合、obentou.foot@gmail.comがメールアドレスとしても使われますので、店名等を連想する内容が良いと思います。
    • アルファベット (a-z)、数字 (0-9)、およびピリオド (.) のみが使用できます。
  • パスワード(推測されにくいものを入力します。確認のため2回入力が必要です)
  • すべて入力したら「次へ」をクリックします

ステップ2

セキュリティ保護のため、本人認証が必要になります。
ショートメッセージ(SMS)が使用できるスマートフォンや携帯電話をお持ちの場合は、その端末の電話番号を入力して「次へ」をクリックします。

画面が切り替わり、認証コードを入れるよう促されます。
先程登録された番号の端末(携帯電話やスマートフォン)にGoogleから認証コードが送信されていると思いますので、そのコードを入力し「確認」をクリックします。

ステップ3

  • 電話番号(省略可能)
    • アカウントのセキュリティ保護のために登録します。
  • 再設定用のメールアドレス(省略可能)
    • パスワードを忘れてしまった場合などに、再設定のためのメールを受け取るために登録します。
  • 生年月日(ご自身の生年月日で良いと思います)
  • 性別
  • すべて入力が完了したら「次へ」をクリックします

ステップ4

  • プライバシー ポリシーと利用規約を読み、問題なければ「同意する」をクリック

これで、Googleアカウントが新しく作成されました。

このアカウントを使用して、Googleの提供する各種サービスを利用することができます。

Googleドライブにアクセス

Googleドライブとは、これから作成する専用サイトのデータを保管しておくために利用します。

画像ファイル等のデータも保管できる、「インターネット上のハードディスク」のようなものとお考えください。

  • 画面右上の点が9つ集まったボタンを押します。
  • 利用できるサービスの一覧(一部)が表示されますので、「ドライブ」をクリックします。
  • この画面がGoogleドライブです。

新規ドキュメントで「サイト」を作成する

  • Googleドライブの画面上でマウスを右クリックします
  • 開いたメニューの中の「その他」にカーソルを合わせます
  • サブメニューが開くので、その中から「Googleサイト」をクリックします

サイトの作成画面が開きました。この画面でサイトを作っていきます。

ドキュメント名を設定する

作成したサイトデータは「ドキュメント」と呼ばれるファイル形式で保存されます。

今後複数作成することなどあるかもしれませんので、どれがなんのファイル(サイト)かわかるように名前をつけておきます。今回は「テイクアウト注文サイト」としました。

サイト名を設定する

実際の表示されるサイトの名前を設定します。

お店の名前であったり、すでにホームページをお持ちの場合は、テイクアウト専用のサイトであることがわかるようにしても良いと思います。今回は「ホカホカ弁当のフット テイクアウト注文ページ」とします。

もし、お店のロゴ画像があれば、文字の左に画像を使うことも可能です。

見出しの変更

サイトに訪れたお客様が最初に見る画面です。
このサイトがどのようなサイトであるかわかりやすく簡潔にまとめます。
また、背景に写真を配置することも可能です。

タイトル部分の空いたスペースをクリックすると、画像の変更をするためのボタンが表示されます。

パソコンから画像をアップロードし、設定します。
背景画像と見出し、そしてロゴを設定するとこのようになります。

商品情報を掲載する

サイトの核となる情報です。
まずは、サイトを見た方がパッと見てわかるように、見出しを付けましょう。

見出しは情報のかたまり毎に付けてあげると情報が整理され、分かりやすくなります。ここでは「お持ち帰りメニュー」とします。お好みに合わせて配置など調整します。

続いて、商品のリストを配置します。

右側のパネルから「挿入」タブをクリックし中段あたりの「レイアウト」から横並びのレイアウトのものをクリックします。

編集画面上にレイアウトが反映されます。このレイアウトを使用して商品情報を掲載します。画像部分は商品の写真、テキスト部分には商品名と価格を記載します。

1つのレイアウトで3つ分の情報が掲載できるので、対象の商品数に合わせてレイアウトを複数設置します。

その他、必要となる情報を登録していきます。

掲載すべき情報はお店や企業毎に異なると思いますが、あると良いと思われる情報をいくつかご紹介します。

  • ご利用の流れ(申し込みから受け取りまでの流れや支払い方法について説明)
  • お店の紹介(住所、電話番号、お店の地図など)
  • お願い事項(新型コロナに関係してお客様にお願いすべき事項やお店ごとのルールなど)

一通り入力が完了したものがこちらです。

Googleフォームで注文用フォームを作成する

続いて、Googleサイトから少し離れ、注文を受け付けるためのフォームを作成します。作成には、Googleのサービスである「Googleフォームを利用します」

以下のリンクからGoogleフォームにアクセスしてください。

Googleフォームにアクセス

はじめてアクセスするとこのような画面になります。

すでに作成されたテンプレートを使用しても良いですし、まっさらな状態から必要な項目を自分で追加する方法でも結構です。今回は「空白」を選択してゼロから作成します。

  • ドキュメント名を設定します。(自動的にフォームのタイトルも入力されます)
  • 商品選択の入力項目を追加します。
    • お店によっては様々かと思いますので、画像は一例となります。
    • お弁当が数種類あり、1回の購入で同一の商品を複数購入される可能性がありますので、それぞれに個数が選択できるようにしました。
  • その他注文を受け付けるために必要となる項目を登録します
    • 名前
    • メールアドレス
    • 電話番号
    • 受け取り希望日
    • 受け取り希望時間
    • その他確認事項

全ての項目が入力できたら、フォームの作成は終了です。
(入力の都度情報は保存されるので、保存ボタン等を押す必要はありません)

サイトにフォームを埋め込む

  • 再度、Googleサイトの画面に戻り先程作成したフォームをサイトに埋め込みます。
  • 右側のパネル(挿入)の下から2番めにある「フォーム」をクリックします
  • 先程作成したフォームが表示されるので、クリックし、右下の「挿入」をクリックします。
  • 横幅等を調整します。

サイトを公開する

すべての情報を入力し、間違いないことを確認したら、いよいよ公開です!

  • 画面右上にある青色の「公開」ボタンをクリックします
  • 小さなウィンドウが開きます
  • 「ウェブアドレス」の箇所に英語でアドレスに使用する文字を入力います(今回は「foot-obentou」としました)
  • 右下の「公開」ボタンをクリックします。

これでサイトが公開されました。

公開されたサイトを表示する

先程使用した「公開」ボタンの右側の下向き三角形をクリックします。

「公開したサイトを表示」をクリックします。

今回のサンプルサイトのアドレスは「https://sites.google.com/view/foot-obentou/」になります。

このアドレスを忘れないように、コピーしてメモ帳などに貼り付け残しておきましょう。

サイトを告知する

通常のホームページと同様に作成した受注サイトをお客様に知ってもらうため告知をします。

作ったばかりのサイトは世の中にまだ認知されていませんので、何らかの方法でその存在を知って貰う必要があります。

今回は、SNSの力を借りて告知したいと思います。

すでにFacebookやTwitterを活用されている場合は、ご自身のアカウントやお店のアカウントに、作成したサイトのURLを貼り付け、コメントを付けて投稿します。(まだ利用したことが無い方はこの機に始められても良いかも知れません)

また、SNS以外にも、すでに各地域ではテイクアウトのお店情報をまとめたサイトやブログ記事などを立ち上げ、応援しようという動きもありますので、そういったサイトに掲載をお願いするという方法もアリだと思います。
掲載方法については、それぞれのサイトでアナウンスされていると思いますので、そちらをご確認ください。

公開ファイル

今回作成したサンプルサイトとその中で使っているフォームのデータをどなたでもご利用いただけるように公開いたしますので、ご自由にアクセスいただければと思います。

サイトデータ

フォームデータ

※各データは閲覧許可がされていますので、ご自身で作成されたGoogleアカウントでアクセスしていただき、コピーしてご利用ください。

(2021.02.08追記)
※コピーしてご利用頂けるようデータ公開しておりましたが、元データを直接編集されてしまう方がいらっしゃるようですので、公開を一旦停止いたしました。
ご理解のほど、よろしくお願いいたします。

最後に

今回ご紹介した方法は取り急ぎ受注を受け付けるためにコスト(お金と時間)をかけずに準備することを主眼においていますので、余裕ができたら既存のホームページを管理いただいている業者さんに相談するなどして正式版を実装したり、その他の方法を検討するなど、次のアクションにつなげていただければと思います。

実際に試すにあたり、わからないことやうまく行かないことなどありましたら、可能な限りお手伝いいたしますので、お気軽にご相談ください。

今回の記事を参考に1社でも1店舗でも事業のオンライン化にお役立てできれば幸いです。

私達もITやWebの力を活用してできることが無いか考えていきますので、新型コロナウイルスに負けないよう一緒に頑張って行ければと思います!

Webサイトをもっと便利に!

フットはWebサイトの検討段階から活用方法までご提案できる、Web制作会社です。Webを使ったマーケティング戦略はもとより、デザイン・CMSの導入やカスタマイズなど社内で一貫して対応します。
お困りごとがあれば、お気軽にご相談ください。