Automated Web Form Data Collection and Storage to Google Sheets

Automated Web Form Data Collection and Storage to Google Sheets

Overview

This n8n workflow allows you to collect data from a web form and automatically store it in a Google Sheet. It includes data cleanup, date stamping, optional batching, and throttling for smooth handling of single or bulk submissions.

What It Does

Accepts data submitted from a frontend form via HTTP POST Cleans and structures the incoming JSON data Adds the current date automatically Appends structured data into a predefined Google Sheet Supports optional batch processing and a wait/delay mechanism to control data flow

Features

Webhook trigger for external form submissions
JavaScript-based data cleaning and formatting
Looping and delay nodes to manage bulk submissions
Direct integration with Google Sheets via OAuth2
Fully mapped columns to match sheet structure
Custom date field (submitted_date) auto-generated per entry

Who’s It For

This workflow is perfect for:

Developers or marketers collecting lead data via online forms
Small businesses tracking submissions from landing pages or contact forms
Event organizers managing RSVP or booking forms
Anyone needing to collect and store structured data in Google Sheets automatically

Prerequisites

Make sure the following are ready before use:

An n8n instance (self-hosted or cloud)
A Google account with edit access to the target Google Sheet
Google Sheets OAuth2 API credentials** configured in n8n
A web form or app capable of sending POST requests with the following fields: business_name location whatsapp email name

Google Sheet Format

Ensure your Google Sheet contains the following exact column names (case-sensitive):

| Business Name | Location | WhatsApp Number | Email | Name | Date | |---------------|------------|------------------|----------------------|----------------|------------| | SpaGreen | Bangladesh | 8801322827753 | spagreen@gmail.com | Abdul Mannan | 2025-09-14 | | Dev Code Journey | Bangladesh | 8801322827753 | admin@gmail.com | Shakil Ahammed | 2025-09-14 |

> Note: The "Email" column includes a trailing space — this must match exactly in both the sheet and column mapping settings.

Setup Instructions

1. Configure Webhook

Use the Webhook node with path:
/93a81ced-e52c-4d31-96d2-c91a20bd7453
Accepts POST requests from a frontend form or application

2. Clean Incoming Data

The JavaScript (Code) node extracts the submitted fields
Adds a submitted_date in YYYY-MM-DD format

3. Loop Over Items (Optional for Batches)

The Split In Batches node allows handling bulk form submissions
For single entries, the workflow still works without adjustment

4. Append to Google Sheet

The Google Sheets node appends each submission as a new row
Mapped fields include: Business Name
Location
WhatsApp Number
Email
Name
Date (auto-filled)

5. Add Delay (Optional)

The Wait node adds a 5-second delay per loop
Helps throttle requests when handling large batches

How to Use It

Clone or import the workflow into your n8n instance
Update the Webhook URL in your frontend form’s POST action
Connect your Google Sheets account in the Google Sheets node
Confirm that your target sheet matches the required column structure
Start sending data from your form — new entries will appear in your sheet automatically

> This setup ensures form submissions are received, cleaned, stored efficiently, and processed in a controlled manner. Notes

Use the Sticky Notes in the workflow to understand each node’s purpose
You can modify the delay duration or disable looping for single submissions
For added security, consider securing your webhook with headers or tokens

Ideal Use Cases

Contact forms
Lead capture pages
Event signups or bookings
Newsletter or email list opt-ins
Surveys or feedback forms

Support WhatsApp Support: Chat Now Discord: Join SpaGreen Community Facebook Group: SpaGreen Support Website: spagreen Developer Portfolio: Codecanyon SpaGreen