# Website Form to Google Sheets: Two Ways with n8n > Two ways to send a website form to Google Sheets with n8n: a ready-made template with its own form, or a Lovable page with a webhook and an AI agent. Source: https://learn.ynteractive.com/content/blog/website-form-to-google-sheets · Updated 2026-10-22 · Free from Stepthrough (https://learn.ynteractive.com) Quick answer There are two simple ways to get website form submissions into Google Sheets with n8n: import a ready-made [n8n template](https://learn.ynteractive.com/content/glossary/n8n-template) that comes with its own form, or build your own page in Lovable that sends each submission to an n8n [webhook](https://learn.ynteractive.com/content/glossary/webhook), where an [AI agent](https://learn.ynteractive.com/content/glossary/ai-agent) saves the row and replies. This guide is for small-business owners who want every inquiry in one sheet instead of scattered across an inbox, and it compares two free lessons: [Find and Use n8n Templates](https://learn.ynteractive.com/content/find-and-use-n8n-templates) and [Build a Web App with an AI Backend](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend). Last updated October 22, 2026 [Take the free module →](https://learn.ynteractive.com/courses/n8n-jump-start/3)Module 3 of the free [n8n Jump Start](https://learn.ynteractive.com/courses/n8n-jump-start) course, about 9 minutes. No account needed. By [Robert Breen](https://learn.ynteractive.com/content/about) · Published October 22, 2026 · Updated October 22, 2026 · 6 min read n8n · Google Sheets · Lovable · Forms Both routes end the same way: a new row in Google Sheets and an email back to the person who filled in the form. They differ in how much you build, how the form looks and whether AI is involved. ## What are the two ways to send a form to Google Sheets? Route one is an n8n template: the form, the Google Sheets step and the Gmail step come prebuilt, and n8n hosts the form. Route two is a Lovable page connected to an n8n webhook: you design the form, and an AI Agent in n8n handles each submission. | | n8n template with its own form | Lovable page + n8n webhook + AI agent | | --- | --- | --- | | Lesson length | 9 minutes, 36 steps | 15 minutes, 87 steps | | Where the form lives | An n8n form page | Your own Lovable web app | | Design control | Basic | Full: heading, fields, messages, layout | | AI involved | No, a fixed workflow | Yes, an AI Agent with Sheets and Gmail tools | | Reply email | Fixed text with the person's details filled in | Written by the AI for each submission | | Accounts needed | n8n, Google | n8n, Google, Lovable, OpenAI API | ## How does the n8n template route work? You find a template in the n8n gallery, import it, connect Google Sheets and Gmail, point it at your sheet and publish. The lesson uses a template called **Log booking requests to Google Sheets and send a Gmail confirmation** for Hillside Pet Grooming, a made-up business. The imported workflow has three steps: a form, an **Append row in sheet** step and a **Send a message** step. Setting it up takes a few clicks: 1. In the **Set up template** window, create a Google Sheets credential and a Gmail credential with **Sign in with Google**. 2. Open **Append row in sheet**, pick your spreadsheet under **Document** (Hillside Booking Requests) and the tab under **Sheet** (Sheet1). 3. Open **Send a message** and replace the template's message with your own. 4. Click **Execute workflow**, fill in the test form and check every step gets a green check. 5. Click **Publish**. No website builder is involved: n8n opens the form on its own page, and you can link to it from your site. [How to Use n8n Templates](https://learn.ynteractive.com/content/blog/how-to-use-n8n-templates) covers the gallery and import options in detail. ## How does the Lovable and webhook route work? You describe the form in a Lovable prompt, and Lovable builds the page. The page sends each submission to an n8n **On webhook call** trigger, and an AI Agent saves the lead with a **Google Sheets Tool** and replies with a **Gmail Tool**. A **Respond to Webhook** node tells the form it worked. The lesson's form is a "Have a Question?" contact form for a marketing business, with Name, Email, Question and an optional Feedback field. The Lovable prompt tells it to send JSON with the keys name, email, question and feedback, and to read the webhook address from a secret called **N8N_WEBHOOK_URL** instead of hard-coding it. The agent's system message is three lines: be helpful, add the lead to the sheet, reply to the person who sent the form. [Connect a Lovable Form to n8n with a Webhook](https://learn.ynteractive.com/content/blog/lovable-form-n8n-webhook) walks through the wiring, including the Production URL. ## Try it free, step by step **Find and Use n8n Templates**. Skip the blank canvas. Find a ready-made workflow in the n8n template gallery, import it into your workspace, connect Google Sheets and Gmail, test it with a real form entry and publish it. You do every step yourself in a practice copy of n8n, it checks your work as you go, and “Do it for me” finishes any step you get stuck on. Free, and nothing touches your real accounts. [Start the free lesson](https://learn.ynteractive.com/modules/n8n-templates) [Or read the full step-by-step guide](https://learn.ynteractive.com/content/find-and-use-n8n-templates) ## Why must the sheet's headers match? n8n uses the first row of your sheet as column names, so the headers have to match what the workflow writes. A mismatched header means an empty column or a failed step. - **Template route:** the template already maps the columns. In the lesson's words, your sheet just needs those headers in its first row: Name, Email, Pet name and Submitted. - **Lovable route:** you create a **Leads** sheet with Name, Email, Question and Feedback in row 1, matching the form's fields. In the Google Sheets Tool, the ✦ button next to each column lets the agent fill it in. Spell the headers exactly as the workflow expects, including capitals and spaces, and keep them in row 1. ## What does each route send back to the person? Both routes send an email, but one is fixed and one is written fresh by AI. The template sends the same message every time with details filled in by expressions: ```text Hi {{ $json.Name }}, Thanks for reaching out to Hillside Pet Grooming! We got your request for {{ $json["Pet name"] }} and will call you within one business day to pick a time. ``` The Lovable route's agent writes each reply itself, based on what the person asked. That's more personal, and it also means you should read the first replies and give the agent clear rules in its system message. More on writing confirmations in Automatic Confirmation Emails for Form Submissions. ## Which form-to-sheet route should you pick? Pick the template if you want a working form today and a fixed confirmation is enough. Pick Lovable and a webhook if the form needs to match your site, or each submission needs judgment. - **Booking or callback requests** with a set reply: the template. - **Contact forms** where people ask real questions: Lovable plus the AI agent. - **Requests that need sorting**, like emergencies or lead ratings: the Lovable route, where the agent's system message holds the rules. - **Not sure yet:** start with the template. You'll learn credentials, sheets and publishing, and the same skills carry over. ## What does a form-to-sheet setup cost? Both lessons are free and run in practice copies, so nothing is published, sent or billed. Building it for real: - **Template route:** n8n (n8n Cloud is paid after a free trial, or self-host it) and a Google account. - **Lovable route:** the same, plus Lovable (free and paid plans) and an OpenAI API key, which is pay-as-you-go and billed separately from ChatGPT plans; the lessons suggest about $10 of credit. Test either route with your own email address before real visitors use it. More builds are on the [n8n tool page](https://learn.ynteractive.com/content/tool/n8n) and the [Lovable tool page](https://learn.ynteractive.com/content/tool/lovable). ## Key takeaways - An n8n template with its own form can send each submission to Google Sheets and a Gmail confirmation with no website builder and no AI. - A Lovable page can send form data to an n8n webhook, where an AI agent saves the row and writes a reply for each person. - In both routes, the sheet's row 1 headers must match what the workflow writes, such as Name, Email, Pet name and Submitted. - The template route sends a fixed confirmation with details filled in; the Lovable route's AI writes each reply, so read the first ones. - The template route needs n8n and Google; the Lovable route also needs Lovable and an OpenAI API key. ## Frequently asked questions **Can I send a website form to Google Sheets without AI?** Yes. The n8n template in the lesson logs each form entry to Google Sheets and sends a fixed Gmail confirmation with no AI involved. **Do I need a website to use the n8n template's form?** No. n8n hosts the form on its own page. You can link to it from your website, social profiles or emails. **Why is my Google Sheets column empty after a submission?** The header in row 1 probably doesn't match the name the workflow uses. Check spelling, capitals and spaces. **Can I use Google Forms instead?** Google Forms can save responses to a sheet on its own. These lessons use n8n so the same workflow can also send emails and, with an agent, make decisions. **Is Hillside Pet Grooming a real business?** No. Hillside Pet Grooming and the marketing business in the Lovable lesson are made-up examples. ## Free lessons in this post - [Find and Use n8n Templates](https://learn.ynteractive.com/content/find-and-use-n8n-templates): Skip the blank canvas. Find a ready-made workflow in the n8n template gallery, import it into your workspace, connect Google Sheets and Gmail, test it with a real form… - [Lovable + n8n: Build a Web App with an AI Backend](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend): Build a contact form in Lovable and connect it to an n8n workflow — webhook trigger, AI Agent, Google Sheets, Gmail, and a Respond node that ties it all together. ## Watch it in a free lesson: Lovable + n8n: Build a Web App with an AI Backend ### Build a Web App with an AI Backend: video walkthrough Full walkthrough · 9:03 · with captions Build a contact form in Lovable and connect it to an n8n workflow — webhook trigger, AI Agent, Google Sheets, Gmail, and a Respond node that ties it all together. The whole lesson narrated step by step, recorded in Stepthrough’s simulated practice environment. [Watch it with chapters and the full transcript](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend#watch) From the free lesson [Lovable + n8n: Build a Web App with an AI Backend](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend) ## Related terms Plain-English definitions, each with an example from a free lesson. [n8n template](https://learn.ynteractive.com/content/glossary/n8n-template) · [Webhook](https://learn.ynteractive.com/content/glossary/webhook) · [AI agent](https://learn.ynteractive.com/content/glossary/ai-agent) · [Autoresponder](https://learn.ynteractive.com/content/glossary/autoresponder) · [Deployment (publishing a web app)](https://learn.ynteractive.com/content/glossary/web-app-deployment) · [Merge field](https://learn.ynteractive.com/content/glossary/merge-field) · [Missed-call text back](https://learn.ynteractive.com/content/glossary/missed-call-text-back) · [No-code (and low-code)](https://learn.ynteractive.com/content/glossary/no-code) [The full AI glossary](https://learn.ynteractive.com/content/glossary) ## Related prompts - [Automation candidates prompt](https://learn.ynteractive.com/content/prompts/automation-candidates-prompt): Rank your repetitive tasks by which to automate first, using only your own counts and minutes, with a first workflow sketched… - [Customer intake form questions prompt](https://learn.ynteractive.com/content/prompts/customer-intake-form-questions-prompt): Design the questions for a booking or intake form: only what you need to do the job, each with a field type, help text and a… - [Lovable web form prompt](https://learn.ynteractive.com/content/prompts/web-form-builder-prompt): Write a Lovable prompt for a web form that posts to n8n: fields, validation, button states, a thank-you message, and a webhook… - [Appointment reschedule reply prompt](https://learn.ynteractive.com/content/prompts/appointment-reschedule-reply-prompt): A ChatGPT prompt for replying to a reschedule request with only your real open slots, the right weekday for every date and no… [All free prompt templates](https://learn.ynteractive.com/content/prompts) ## Visual guides The same ideas as quick visual guides: swipe through the slides, or read each one as text. - [Build a web form with an AI backend, no code](https://learn.ynteractive.com/content/visual/lovable-n8n-form): Most website forms just land in an inbox and wait. This one does the work. You describe the form in Lovable, and it builds it. - [How to use n8n templates without the red warnings](https://learn.ynteractive.com/content/visual/n8n-templates-myth): Most people copy an n8n template, see a canvas full of red warnings and give up. The warnings just mean the template can't know your accounts or your data. - [5 Steps to Find, Import and Run an n8n Template](https://learn.ynteractive.com/content/visual/5-steps-use-an-n8n-template): A visual guide: find an n8n template, import it, connect your own Google Sheets and Gmail accounts, make it yours and run a test. [All visual guides](https://learn.ynteractive.com/content/visual) ## Keep reading - [n8n Triggers Explained: Which One Starts Your Workflow?](https://learn.ynteractive.com/content/blog/n8n-triggers-explained): n8n triggers explained: schedule, Gmail, chat, webhook and form triggers, how to test each one, and how the trigger changes your AI Agent's prompt. - [Learn n8n for Beginners: 6 Free Projects in Order (2026)](https://learn.ynteractive.com/content/blog/learn-n8n-for-beginners): Learn n8n for beginners with six free, hands-on projects in a sensible order, from templates to AI agents to a web form, plus what you need for real. - [How to Write a Lovable Prompt for a Form](https://learn.ynteractive.com/content/blog/lovable-prompt-for-a-form): A Lovable prompt for a form, section by section: fields, heading, webhook keys, submission states, validation and the secret, and how to adapt it. [All blog posts](https://learn.ynteractive.com/content/blog) · [All free tutorials](https://learn.ynteractive.com/content)