スポンサーリンク

ブログ(WordPress) への Google フォーム設置方法、スプレッドシートへのお問い合わせ内容の記録&Gmail への通知


ブログ(Wordpress)にお問い合わせフォームを設置しました。使用したのは Google フォームです。

備忘録も兼ねて、Wordpress への Google フォームの設置方法について説明したいと思います。

スポンサーリンク

1、Google フォームの作成

まず、Google フォームを作成する必要があります。

Google ドライブで「➀マイドライブ」から「②Google フォーム」を選択します。

すると「無題のフォーム」が作成されます。

ファイル名を付けます(これがそのままフォームの名前になります)。
「お問い合わせフォーム」としました。

次に、フォームに記入して頂く項目の設定を行います。上の図にあるようにデフォルトでは1つの項目「無題の質問」がラジオボタンの形式で設定されています。

これをお問い合わせ頂く際に、ご記入頂きたい内容に変更しなければなりません。

私が設定した項目は、「お名前」、「メールアドレス」、「題名」、「お問い合わせ内容」の4つです。

これらの設定の仕方について説明します。

まず、デフォルトの項目「無題の質問」を「お名前」に変更し、形式は「記述式」を選択します。
「記述式」というのは、回答項目が短文で改行が無い場合の文章での回答形式です。

続いて、他の項目を追加していきます。
項目を追加する場合は右側にある「⊕」を選択します(項目を削除する場合は、下側にある「ゴミ箱マーク」を選択)。

「メールアドレス」、「題名」は「お名前」と全く同じ(記述式)ようにして設定します。

一番最後の「お問い合わせ内容」は形式を「段落」にします。
「段落 」というのは、回答項目が長文で改行をする場合の文章での回答形式です。

お問い合わせ頂く文章はある程度長文になると思うので、この形式にしました。

項目のうち、必ずご記入頂きたいものを「必須」として設定します。個々の項目の下側にある「必須」のところをクリックしてオンにします。

私は「お名前」、「メールアドレス」、「題名」、「お問い合わせ内容」の4項目すべてを「必須」として設定しました。

次にお問い合わせフォームにご記入頂いた後に画面上に表示されるメッセージを自分で考えて変更します。

画面右上の「歯車マーク」を選択します。

➀「プレゼンテーション」を選択し、②確認メッセージの内容を変更します。

ここまでで、Google フォームそのものの設定は終了です。

続いて、フォームに回答頂いた内容を記録するためのスプレッドシートの設定をしていきます。

2、回答内容をスプレッドシートに自動的に記録していくための設定、Gmail への通知設定

先までのフォーム設定の際には、フォームの上側で「質問」を選択した状態(デフォルト)でしたが、今度は➀「回答」を選択して、②右側の緑色の「+」を選択します。

➀「新しいスプレッドシートを作成」を選択(デフォルトで選択している)した後、②「作成」を選択します。
なお、既存のスプレッドシートに記録していく場合は、「既存のスプレッドシートを選択」を選択します。

すると新規にスプレッドシートが作成され、1行目に先ほどGoogle フォームで設定した項目が反映されています。

ファイル名を変更しておきます。

以後、お問い合わせフォームに回答項目を入力し送信して頂くと、各回答項目ごとにこのスプレッドシートの2行目以降に回答内容が自動的に反映されていきます。
回答内容は Google フォームの画面上でも確認できますが、スプレッドシートを使えば一覧の形式になるので整理や検索がしやすいと思います。

次に、Google フォームへの入力(送信)があったときに、自分のGmail に通知が来るように設定します。

スプレッドシートの「ツール」から「通知ルール」を選択します。

通知する場合として「ユーザーがフォームを送信したとき」を選択し、通知方法として「メール – その都度」を選択します。
こうしておくことで、お問い合わせ頂いたたびに自分の Gmail に通知が来るようになります。

次に、Google フォームの送信テストを行います。

先に作成した Google フォームを開いて、上側にある「プレビューボタン」選択します。

回答項目を記入し、送信ボタンをクリックします。

すると、先ほど作成したスプレッドシートの2行目に、今フォームに入力した内容が反映されていることが確認できると思います。

また、Gmail にもフォームが送信された旨の通知が入ります。

3、Wordpress への Google フォームの設置

以上で、Google フォームそのものの設定と、フォームの送信があった場合にスプレッドシートに記録し、かつ自分の Gmail に通知が届くという仕組みが出来上がりました。

次は、先に作成したフォームを WordPress に設置します。

先に作成したフォームを開き、右上の「送信」を選択します。

「HTMLを埋め込む」のところに、このフォームの情報がコードとなって出てきます。

「コピー」を選択します。

WordPress を開き、お問い合わせのページに貼り付けます(Ctrl + V)。

この状態でサイトを確認すると、以下のように先ほど作成したフォームが埋め込まれているのが確認できます。

念のため、Web 上からもちゃんとフォームの送信ができるかテストしておきます。

回答項目を入力して送信を選択します。

スプレッドシートの3行目に先の続きで、送信した内容が反映されます。

同様に Gmail を確認すると、フォーム送信の通知が来てます。

これで WordPress への google フォームの設置は完了です。

今後のこのブログの内容次第で、またフォームの回答項目の変更などあるかもしれませんが、とりあえずはこのフォームをお問い合わせ窓口にしたいと思います。