お問い合わせフォームで送信された内容を、Googleスプレッドシートに自動で反映されるようにしてほしい
たまに上記のようなご依頼を受けることがあります。
WordPressを使ったサイト制作では、問い合わせフォームプラグインの【Contact Form 7】+【CF7 Google Sheet Connector】で簡単に実装できます。
本記事では【Contact Form 7】+【CF7 Google Sheet Connector】でWordPressサイトからの問い合わせ内容を自動でスプレッドシートにも反映する方法をまとめました。
色々調べてみましたが、他の問い合わせフォームプラグインはスプレッドシート連携のプラグインが用意されていなかったりしたため、この組み合わせが一番簡単に実装できるかと思います。
「CF7 Google Sheet Connector」をインストールする
プラグイン追加画面から「CF7 Google Sheet Connector」を検索し、「今すぐインストール」をクリックし、「有効化」します。
問い合わせフォームと連携したいスプレッドシートを用意する
問い合わせフォームの内容を、自動反映させたいスプレッドシートを用意します。
「CF7 Google Sheet Connector」をインストールすると、コンタクトフォームの編集画面に「Google Sheets」というタグが追加されているのでクリックします。
そこのタブに連携したいスプレッドシートの情報を入力する欄があるので、スプレッドシート情報を入力して、「保存」を押します。
スプレッドシートにカラムを追加する
こんな感じで、スプレッドシートに問い合わせフォームのカラムを記載します。
記載する単語は、フォームで設定した【name属性】の値を入力します。
【name属性】とはコンタクトフォームの編集画面内で[text* company-name] このような入力している部分で設定している固有の英単語のことです。
GoogleアカウントとContactForm7を連携する
管理メニューから「Google Sheets」を選択します。
Google Access Codeの入力欄があるため、「Get Code」をクリックします。
Googleのアカウント選択画面に切り替わるため、先ほどスプレッドシートを作成したアカウントを選択してください。
ページが切り替わり、以下のチェック項目にチェックを入れます。
このチェックを入れ忘れると、問い合わせフォームの内容がスプレッドシートに反映されないため必ずチェックを入れる。
認証コードが発行されるためコピーします。
コピーした認証コードを先ほどの、Google Access Codeの入力欄に貼り付けて「Save」を押します。
以上でGoogleアカウントとContactForm7を連携が完了です。
実際に自動反映されるかを確認
ContactForm7とGoogleスプレッドシートの連携は、以上で全て完了です。
実際に、お問い合わせフォームを送信してみると、スプレッドシートに反映されていることが分かるかと思います。
スプレッドシート内の【date】と【time】は「CF7 Google Sheet Connector」で用意されているカラムなので、追記すると問い合わせ日時も分かり便利です。
以上で設定は完了です。