【簡単5分】STUDIOのお問い合わせフォームの作り方！

「お問い合わせフォームの設置って面倒くさそう、、、」と思われる方が多いですが、STUDIOのお問い合わせフォームは設置がとにかく簡単です。

STUDIOの操作に慣れていない方でも、5分あれば必ず実装できます。

そこで今回はSTUDIOのお問い合わせフォームの作り方、そしてよく使うカスタマイズ方法について詳しく説明していきます。

ぜひ参考にしてみてください！

お問い合わせフォームを設置するメリット3選

デジタル化が主流になった現代で、お問い合わせフォームはあって当たり前の存在になりつつあります。なぜならお問い合わせフォームは、お客様からしても、サービス運営者側からしても大きなメリットがあるからです。

これまでの受付方法は「電話」が主流だという会社は多いです。電話メインの会社だと認識の齟齬が起きやすくトラブルになるケースが多くなります。

ですがお問い合わせフォームを設置すれば、お問い合わせフォームで頂いた内容が文字情報で入ってくるので認識の齟齬をなるべく減らせます。

またお客様からしても電話のハードルは高いですが、お問い合わせフォームだと話す必要がないので心理的なハードルもグッと下がります。

そして1番のメリットは、「24時間いつでもお問い合わせを受けられる」ということです。電話対応だと「9:00-18:00」の営業時間のみなど、時間が限られるケースがほとんどです。

ですがお問い合わせフォームはもちろん24時間稼働してくれます。

例えば、夜の21時にお客様がサイトを閲覧していて「このサービス良いな！申し込もう」となった時にも、お問い合わせフォームがあれば熱感が冷めることなくすぐに申し込んでくれるようになります。

「サービスの申し込み」・「お問い合わせ」を目的としているサイトであれば、必ずお問い合わせフォームは設置するようにしましょう。

STUDIOのお問い合わせフォームの作り方

STUDIOのお問い合わせフォームの作り方は、下記の5ステップとなります。

それぞれ画像を用いて、具体的に説明します。

手順①：お問い合わせフォームを設置する

左側のメニューの「追加」をクリックして、お問い合わせフォームを3つの中から選びます。

今回はよく使われる「Form1」を使用していきます。Form1を右側にドラッグ&ドロップしましょう。

まず、お問い合わせフォームの設置は完了です！

手順②：各項目のタイトルを編集する

初期設定だと、お問い合わせフォームの項目が「Full Name」や「Email」など日本人向けにはなっていません。

なので各項目のタイトルを英語→日本語に変更して、見栄えをよくしましょう。

編集したい文字の部分をダブルクリックすれば、文字を変更できるようになります。

「Full Name」の部分を、「氏名」や「お名前」などに変更しておきましょう。

同様に「Email」→「メールアドレス」、「Message」→「お問い合わせ内容」というように変更しておきましょう。

手順③：各項目の詳細設定をおこなう

次に、各項目の詳細設定をおこなっていきます。設定する項目は、下記のとおりです。

今回はお問い合わせフォームの項目である「メールアドレス」を例にしながら、詳細設定をおこなっていきます。

まずお問い合わせフォームをクリックして、全体を選択しましょう。

右メニューに「Email」の項目が出てきますのでクリックしましょう。

右メニューに「タイプ」・「必須項目」・「プレースホルダー」の設定欄が出てくるはずです。

メールアドレスの項目は、下記のように設定してます。

これで詳細設定は完了です！「氏名」や「お問い合わせ内容」の項目も同様に、詳細設定をおこなっておきましょう。

手順④：送信先の設定をおこなう

これでお問い合わせフォームの大枠は完成しました。まだ済んでいないのがお問い合わせフォームの送信先です。

お問い合わせフォームをクリックして、全体を選択しましょう。

右側メニューに「通知先の設定・集計結果」が出てくるのでクリックします。

右上にある「設定」をクリックします。

下記のようなポップアップが出てくるので、「フォーム通知の送信先」と「通知メッセージタイトル」を設定しましょう。

• フォーム通知の送信先：お問い合わせ内容が届くメールアドレス
• 通知メッセージタイトル：届くメールの件名

これでお問い合わせフォームの送信先の設定は完了です！

手順⑤：サイトを公開する

では実際にサイトを公開してみて、お問い合わせフォームが届くか確認してみましょう。

右上にある「公開」ボタンをクリックします。ポップアップが出てくるので、また「公開」をクリックしてOKです。

公開したサイトにアクセスして、お問い合わせフォームを送信します。

登録していたメールアドレスに、下記のようなメールが届くはずです。

STUDIOのお問い合わせフォームのカスタマイズ2選

上記で作ったお問い合わせフォームは、最低限のカスタマイズしか行っておりません。

そこでよく行われるカスタマイズを2つ紹介します。

どちらも設定は簡単です。ぜひ取り入れてみてください！

Googleスプレッドシートで集計管理する

お問い合わせ内容のデータは、STUDIOのダッシュボードに基本的に蓄積されていきます。ですがダッシュボードでのデータの管理・分析は役不足であり、効率が悪くなってしまいます。

そんな時に大活躍なのが「Googleスプレッドシート」です。

データを整列できるので、お問い合わせフォーム内に下記項目がある場合は、連携してみるとメリットが大きいでしょう。

• ラジオボタン
• チェックボックス
• セレクトボタン

お客様はどのようなニーズを持っているのか、よくいただくお問い合わせ内容は何か、などを分析するのもGoogleスプレッドで分析すればすぐにわかります。

データドリブンにサイトを運用したい方は、ぜひGoogleスプレッドシートと連携するようにしましょう。

◼︎Googleスプレッドシートとの連携方法

①お問い合わせフォームをクリックして、全体を選択しましょう。

②右側メニューに「通知先の設定・集計結果」が出てくるのでクリックします。

③右上にある「設定」をクリックします。

下記のようなポップアップが出てくるので、外部連携の「スプレッドシート」のマークをクリックします。Googleアカウントを選択して、指示にしたがって進めましょう。

サンクスページを設定する

サイトの信頼性を高めるのであれば、お問い合わせ後の「サンクスページ」を用意するのがおすすめです。

サンクスページはメリットが多いので、面倒でなければなるべく設定するようにしましょう。

◼︎サンクスページの設定方法

①新たなページを追加して、サンクスページを作成する。

②お問い合わせフォームを設置しているページに戻り、お問い合わせフォーム全体をクリックします。

③右側メニューに「送信後のページ」が出てくるので、先ほど作ったサンクスページを選択します。

これでサンクスページの設定は完了です！

STUDIOのお問い合わせフォームに関するよくある質問

最後に、STUDIOのお問い合わせフォームに関するよくある質問に答えていきます。

ホームページ制作は「Terace」にお任せ！