Googleドライブでお問い合せフォームを作る

  • 投稿日:
  • by
  • カテゴリ:
このエントリーをはてなブックマークに追加

MovableTypeにお問い合せフォームを設置するにはプラグインを使ったり、コメント欄を利用したりする方法がありますが、Googleドライブを使ってフォームを設置してみました。

まずはGoogleアカウントにログインしてGoogleドライブ[https://drive.google.com/]にアクセスします。

「作成」をクリックして「フォーム」を選択します。

20131015221037_blogpix.jpg

フォームのタイトルとデザインを決めます。今回はMovableTypeのWebページに埋め込んで使うのでデフォルトの一番シンプルなデザインにしました。

20131015221527_blogpix.jpg

赤矢印のところを修正・入力・選択します。

20131015222941_blogpix.jpg

「アイテムを追加」で必要な項目を追加出来ます。

20131015223526_blogpix.jpg

メールアドレスの入力欄を追加した場合は「データの検証」で「メールアドレス」を選択する事で「半角英数」と「@」「.」以外の文字が入力出来なくすることが出来ます。「必須の質問」にチェックを入れると入力忘れを防止出来ます。

メールアドレスの形式が間違っていると警告文が表示されます。

20131016035156_blogpix.jpg

複数行の入力欄が必要な場合は質問の形式で「段落テキスト」を選びます。

20131015230202_blogpix.jpg

フォームの送信後に表示される文章は「確認ページ」の項目で設定出来ます。

20131015231525_blogpix.jpg

入力・設定が完了して「フォームを送信」をクリックすると共有するリンクが表示されます。リンクURLの横にある「埋め込む」をクリックしてWEBページに埋め込むHTMLソースを取得します。

20131015232419_blogpix.jpg

20131015232650_blogpix.jpg

MovableTypeのWEBページにフォーム用のページを追加してコピーしたHTMLソースをペーストします。

20131015234829_blogpix.jpg

WEBページを公開するとコンタクトページが生成されます。ページにはWEBページのタイトルとGoogleフォームのタイトルが表示されます。ちょっと、しつこいというか、分かりづらいというか。まぁ、この辺は仕方ないかなと思います。

20131016000432_blogpix.jpg

送信完了画面

20131016035443_blogpix.jpg

送信された問い合わせはWEB上で確認出来ます。マイドライブの一覧から名称の最後に「(回答)」と入っているものが送信された問い合わせになります。その項目にアクセスすると回答先を選択する画面になるので新規のスプレッドシートか既存のスプレッドシートのどちらかを選択します。

20131016043632_blogpix.jpg

20131016060502_blogpix.jpg

20131016044846_blogpix.jpg

メニューの「ファイル」から「形式を指定してダウンロード」でエクセルやCSV、テキスト形式など様々な形式のファイルでダウンロード出来ます。

20131016045800_blogpix.jpg

注意点はこのフォームからお問い合せが送られても、デフォルトの設定では通知等が送られて来ません。お問い合せが来た時にメールで通知されるように設定する必要があります。

メニューの「ツール」から「通知ルール」を選択します。

20131016051118_blogpix.jpg

設定画面が開くので通知条件と通知方法を選んで保存します。

20131016053444_blogpix.jpg

設定一覧が表示されたら設定完了です。

20131016054008_blogpix.jpg

これでお問い合せが入るとメールで通知が来ますが、あくまでお問い合せが入ったという通知だけで、お問い合せの内容についてはメールでは分からないので、メール内のリンクからGoogle Driveにアクセス・ログインしてスプレッドシートを確認する必要があります。