Tech

How to save the result of Contact Form submission to Google Spreadsheet

When you use WordPress, you usually use a plugin called “Contact Form 7” developed by Takayuki Miyoshi as your contact page.

This plugin is highly functional and can be used as a stock contact form for most websites.

However, Yuichiro ABE has developed “Contact Form 7 add confirm”, a plugin that makes Contact Form even more functional.

With this plugin, Contact Form 7 can be used as a “Form” not only for various types of inquiries, but also as a highly functional application form.

In this article, I will also show you how to set up a plugin called “CF7 Google Sheet Connector” to save the results of Contact Form submissions to Google Spreadsheet just like a Google Form.

I am on Twitter. Or Contact us here.

Contact Form 7のインストール

Type “Contact Form” in the “Add New Plugin” section.

Then, “Contact Form 7” will appear on the top page, so let’s install and activate it.

What is Contact Form 7?

It’s a plugin so famous that anyone who has ever built a blog or website using WordPress knows about it.

When you build a website using the WordPress system, you can add functions to WordPress by using functions called “plug-ins.

This Contact Form 7 is also a plugin, and by adding it, you can easily create a page for common inquiries.

For your reference, the contact page of this site is also created using this Contact Form 7.

Install CF7 Google Sheet Connector

As with Contact Form 7, enter “CF7 Google Sheet Connector” in the Add Plug-in screen.

Install the “CF7 Google Sheet Connector” that appears and activate it.

What is the CF7 Google Sheet Connector?

Although “Contact Form 7” and “Contact Form 7 add confirm” are well known, surprisingly few people know about this CF7 Google Sheet Connector.

This CF7 Google Sheet Connector, the title of which is exactly what this article is all about, is a plugin that allows you to save the information submitted from the form to a Google Spreadsheet that you have set up by integrating it with Contact Form 7.

Linking with Google Spreadsheets

Finally, we are going to link Google Spreadsheet and CF7 Google Sheet Connector.

It looks easy, but it’s surprisingly time-consuming, so let’s do it one step at a time.

Initial Setup of CF7 Google Sheet Connector

After installing the CF7 Google Sheet Connector, click “Settings” from the plugin list screen.

In the “Integration” tab, click the “Get Code” button in the “Google Sheets” column.

This will open the Google account selection screen, so select the account you are mainly using.

Select the account you are using as your main account. Keep going and you will see a screen that says “Copy this code and paste it into your application. Copy it.

Paste this code into the “Google Access Code” field and click the “Save” button to complete the integration.

Creating a Google Spreadsheet

First, let’s create a Google Spreadsheet that will be saved.

Open Google Drive, right-click anywhere, and select “Google Spreadsheet”.

After completing the creation of the Google Spreadsheet, I’m going to configure the settings according to the screen of Contact Form 7 that I want to link to this time.

In the case of this site, the default settings are as follows.

In this, put the item names “your-name”, “your-email”, “your-subject”, and “your-message” in the first line of the Google spreadsheet.

As you may have noticed when you open the Contact Form 7 screen, a new item called “Google Sheets” appears in the tabs when it has been successfully installed.

Configure and save the settings here to complete the linkage.

Configure the settings as follows for each.

  • Google Sheet Name
    →Title of the Google Spreadsheet itself.
  • Google Sheet Tab Name
    →Name of the tab in the spreadsheet. This is the name of the part of the spreadsheet that is “Sheet 1” as you created it.

For “Google Sheet Id” and “Google Tab Id”, you need to pay attention to the URL of the Google spreadsheet.

https://docs.google.com/spreadsheets/d/(This part is Google Sheet Id)/edit#gid=(This part is Google Tab Id)

Click the “Save” button, and you’re done.

Let’s try sending a message from Contact Form 7 yourself, and test whether the content is automatically included in the Google Spreadsheet.

conclusion

In this article, I showed you how to save the submission results of Contact Form to Google Spreadsheet.

By combining Contact Form 7 with Contact Form 7 add confirm, you can create forms that are more scalable than Google Forms.

You can use it not only as a contact form, but also as an application form, and you can save it to Google Spreadsheet at any time with this method, so please give it a try.

I am Japanese, and my computer is set up in Japanese. So there may be some differences in the names of the buttons and windows.

I try to keep the information on this site (tamocolony) up-to-date, but please be aware that the information on this site may not be the most up-to-date, or the information itself may be incorrect. We take no responsibility for the content of this site. If you have any questions about an article or need to make corrections, please contact us via the Contact Us page.