みやちサイト制作所

未経験でもWEBサイト制作で稼ぐためのノウハウまとめ

閉じる

WordPressサイトでの問い合わせ内容をGoogleスプレッドシートに自動で記録する方法

フォームの内容をスプレッドシートに記録

Googleのスプレッドシート、便利ですよね。

特に会社などで、データ分析のためにスプレッドシートを使う人は多いと思います。

question
WordPressサイトの問い合わせが、自動でスプレッドシートに記録されたら便利だな

と思ったことはありませんか?

問い合わせ内容がスプレッドシートに記録されれば、手間が減って問い合わせの管理がしやすくなるはずです。

この記事では、そんなときにWordPressサイトに設置した問い合わせフォームで送られた内容を、自動でスプレッドシートに書き出す方法をまとめました。

miyachi
プログラミングの知識がなくても、プラグインで簡単にできるよ

【この記事の目次】

WordPressサイトからの問い合わせをスプレッドシートに流すために必要なプラグインは2つ

WordPressサイトで入力・送信された内容をスプレッドシートに記録するために必要なプラグインは2つです。

  • Contact Form 7
  • CF7 Google Sheets Connector
contact form 7

お問合せフォームをつくるための無料プラグインです。

今回の件も含め、外部サービスとの連携が得意でカスタマイズ性が高いプラグインといえます。

CF7 Google Sheets Connector

Contact Form 7で作成されたフォームで送信された内容をGoogleスプレッドシートに流し込むための無料プラグインです。

上記2つのプラグインはどちらも無料ですので、それぞれインストール&有効化しておきます。

WordPressサイトでの問い合わせをGoogleスプレッドシートに自動で流し込むための手順

設定の手順は以下のとおりです。

miyachi2
専門知識は必要ないので、1つずつ設定していくだけでOK!

[1] Contact Form 7で問い合わせフォームを作成する

contact form 7

送信内容をGoogleスプレッドシートに流し込むにあたって、フォームの内容に制限はありません

スプレッドシートのことは気にせず、普通に作ってOKです。

[2] 情報を流し込むスプレッドシートを作る

次に、実際に情報を流し込むスプレッドシートを作成します。

スプレッドシートを作成

シートを作成するにあたり、シートの名前などは自由に設定して大丈夫です。

今回は、以下の通りに設定しました。

新規シートを作成
  • ファイル名は「問い合わせ管理」
  • シート名は「contact」

あわせて、1行目に流し込まれるデータの項目名を記入しておきます。

  • A1に「date」
  • B1に「time」
  • C1に「user-agent」
  • D1以降は、フォームの各項目を順に入れる
ポイント

User Agent(ユーザーエージェント / UA)とは、サイトを閲覧している端末・ブラウザが何かを示す情報のこと

今回使うフォームは、Contact Form 7でデフォルトで作られるものを利用します。

テストフォーム

そのため、スプレッドシートの1行目は↓になりました。

スプレッドシートの1行目
  • date
  • time
  • user-agent
  • your-name
  • your-email
  • your-subject
  • your-message

フォームの各項目は、フォーム作成時に「名前」の欄にいれたテキストとなります。

フォームタグ生成

項目名が違っていると、きちんとデータが流し込まれないので注意してください!

miyachi
これで、スプレッドシート側での準備は完了

[3] Contact Form 7側で流し込むシートを設定する

コンタクトフォームの編集

フォームの編集画面にはいると「Google Sheets」というタブが追加されているはずです。

その画面で「ファイル名」と「シート名」を入力して保存します。

[4] Contact Form 7で連携設定をする

最後に、Contact Form7からGoogleスプレッドシートに流し込むための連携設定をします。

お問い合わせのGoogle Sheets

「お問い合わせ」メニューに追加されているサブメニューの「Google Sheets」をクリックします。

Get Code

設定画面の中にある「Get Code」をクリック。

Googleのアカウント確認画面になります。

認証

案内に沿ってパスワードを入れて認証を済ませ、「許可」をクリック。

認証用のコード

画面に認証用のコードが表示されるので、コピーしてください。

WordPressの管理画面にもどって、

認証用のコードを貼り付け

さきほどコピーした認証用のコードを貼り付けて「Save」ボタンをクリックして完了です!

miyachi
「Save」を押すと、フォームから認証用コードは消えるけどちゃんと記録されているので大丈夫だよ
ポイント

認証をすませると、WordPressサイトが連携をしたアカウントにある全てのスプレッドシートにアクセスできるようになる
セキュリティ的に少し脆弱なので、共有用のスプレッドシートのみ編集ができるGoogleアカウントを用意するとベスト

WordPressサイトで問い合わせフォームが送信されると、自動でスプレッドシートに追記される

ここまで設定をきちんとしておくと、フォームで問い合わせが送信されるたびに、自動でスプレッドシートに情報が書き込まれていきます。

流し込まれたデータ

追加で問い合わせが来るたびに、下に下に追記されていく形です。

miyachi2
専門知識がいらないので、簡単だね!

サイトを効率的に作るための
秘蔵ノウハウを発信中

note

開発の基本的な部分はもちろん、コードをより素早く理解して書くための「コツ」をまとめました。15年の開発経験に裏付けられたノウハウをどうぞ!

詳しくはこちら

記事をシェア