Build a website AI chatbot with lead capture using Gemini and Supabase RAG

Open on n8n.io

$20/month : Unlimited workflows

2500 executions/month

Try free

THE #1 IN WEB SCRAPING

Scrape any website without limits

Try free

HOSTINGER

Early Deal
DISCOUNT 20%

Self-hosted n8n

Unlimited workflows - from $4.99/mo

Try free

#1 hub for scraping, AI & automation

6000+ actors - $5 credits/mo

Try free

Important notice

This workflow is provided as-is. Please review and test before using in production.

1. Workflow Overview

This workflow deploys a fully customizable AI chatbot that can be embedded on any website, from custom coded sites to platforms like WordPress. The chatbot is powered by n8n, uses Supabase for memo...

Best for

Support Chatbot automation workflows
AI Chatbot automation workflows
advanced n8n builders looking for reusable templates

Tools used

@n8n/n8n-nodes-langchain.lmchatgooglegemini, n8n-nodes-base.googledrivetrigger, n8n-nodes-base.googledrive, @n8n/n8n-nodes-langchain.vectorstoresupabase, @n8n/n8n-nodes-langchain.documentdefaultdataloader, @n8n/n8n-nodes-langchain.textsplitterrecursivecharactertextsplitter, n8n-nodes-base.stickynote, n8n-nodes-base.splitinbatches

Source and attribution

This workflow is cataloged by N8N Workflows and links back to its original n8n.io source page by Shadrack.

Original n8n.io source

1.1 Workflow description

Title: Build a website AI chatbot with lead capture using Gemini and Supabase RAG
Workflow name: Build a website AI chatbot with lead capture using Gemini and Supabase RAG

This workflow deploys a fully customizable AI chatbot that can be embedded on any website, from custom-coded sites to platforms like WordPress. The chatbot is powered by n8n, uses Supabase for memory and RAG, and integrates SerpAPI, Google Calendar, SMTP, and Google Sheets to automate responses, collect leads, and follow up intelligently.

Unlike typical widgets, this bot captures name and email before chatting, enabling personalized, human-like conversations and smart lead tracking. Check demo here

🎯 Core Features

💡 Universal Embedding – Works on any site (custom HTML or WordPress) using a single embed snippet.

🧠 AI Agent Node + RAG – Powered by Gemini (or any AI model) with Supabase as memory for contextual replies.

🌐 SerpAPI Integration – Lets the agent search the internet for real-time information.

📅 Google Calendar & Sheets – Logs leads, appointments, and chat summaries.

📧 SMTP Node – Sends personalized follow-up emails directly to new leads.

🪪 Lead Capture – Requires users to enter their name and email before chatting, creating personalized sessions.

⚙️ How It Works

Chat Trigger: The widget sends user input to your n8n webhook set to production mode.

AI Processing: The AI Agent node handles the response logic with memory and RAG context from Supabase.

Integrations:

SerpAPI → Real-time search.

Google Calendar & Sheets → Stores lead data and events.

SMTP Node → Sends automatic thank-you or follow-up emails.

Response: The chatbot replies instantly on your website, maintaining session memory.

🧩 Quick Setup Steps

Fork or use the Open Source Repo: The widget script is hosted via CDN from your GitHub repo and is fully editable.

Embed the Widget:

Copy and paste the following snippet into your site’s <head> or footer (or use a plugin like Insert Headers and Footers on WordPress):


&lt;link href="https://cdn.jsdelivr.net/npm/@n8n/chat/dist/style.css" rel="stylesheet" /&gt;
&lt;script&gt;
    window.ChatWidgetConfig = {
        webhook: {
            url: '', // production webhook URL
            route: 'general'
        },
        branding: {
            logo: '', // your logo URL
            name: 'CustomCX Agent',
            welcomeText: 'Hi 👋, how can we help?',
            responseTimeText: 'We typically respond right away',
        },
        style: {
            primaryColor: '#854fff',
            secondaryColor: '#6b3fd4',
            position: 'right',
            backgroundColor: '#ffffff',
            fontColor: '#333333',
        }
    };
&lt;/script&gt;
&lt;script src="https://cdn.jsdelivr.net/gh/shadrack-ago/n8n/widget.js?v=2.6"&gt;&lt;/script&gt;

Connect Integrations:

Add your Supabase, SerpAPI, Google, and SMTP credentials in n8n.

Update your webhook URL in the script above.

Deploy: Activate the workflow, refresh your site, and start chatting with your AI assistant.

🚀 Why Use This Template

Works with any website or CMS.

Captures and stores qualified leads automatically.

Open source — easily modify, brand, or extend it.

Seamlessly integrates AI, CRM, and communication tools.

1.2 Logical Blocks

This catalog entry is organized from the workflow JSON. The node-level section below shows the executable blocks available for review before importing the template.

2. Block-by-Block Analysis

Block 1 - Google Gemini Chat Model

Type / Role: @n8n/n8n-nodes-langchain.lmChatGoogleGemini - lmChatGoogleGemini
Config choices: Version 1

Block 2 - Google Drive Trigger

Type / Role: n8n-nodes-base.googleDriveTrigger - googleDriveTrigger
Config choices: Version 1

Block 3 - Google Drive Trigger1

Type / Role: n8n-nodes-base.googleDriveTrigger - googleDriveTrigger
Config choices: Version 1

Block 4 - Download file

Type / Role: n8n-nodes-base.googleDrive - googleDrive
Config choices: Version 3

Block 5 - Supabase Vector Store

Type / Role: @n8n/n8n-nodes-langchain.vectorStoreSupabase - vectorStoreSupabase
Config choices: Version 1.3

Block 6 - Default Data Loader

Type / Role: @n8n/n8n-nodes-langchain.documentDefaultDataLoader - documentDefaultDataLoader
Config choices: Version 1.1

Block 7 - Recursive Character Text Splitter

Type / Role: @n8n/n8n-nodes-langchain.textSplitterRecursiveCharacterTextSplitter - textSplitterRecursiveCharacterTextSplitter
Config choices: Version 1

Block 8 - Sticky Note

Type / Role: n8n-nodes-base.stickyNote - stickyNote
Config choices: Version 1

Block 9 - Knowledgebase

Type / Role: @n8n/n8n-nodes-langchain.vectorStoreSupabase - vectorStoreSupabase
Config choices: Version 1.3

Block 10 - Loop Over Items

Type / Role: n8n-nodes-base.splitInBatches - splitInBatches
Config choices: Version 3

Block 11 - Embeddings OpenAI

Type / Role: @n8n/n8n-nodes-langchain.embeddingsOpenAi - embeddingsOpenAi
Config choices: Version 1.2

Block 12 - Think

Type / Role: @n8n/n8n-nodes-langchain.toolThink - toolThink
Config choices: Version 1.1

Block 13 - Calculator

Type / Role: @n8n/n8n-nodes-langchain.toolCalculator - toolCalculator
Config choices: Version 1

Block 14 - Sticky Note5

Type / Role: n8n-nodes-base.stickyNote - stickyNote
Config choices: Version 1

Block 15 - Support Agent

Type / Role: @n8n/n8n-nodes-langchain.agent - agent
Config choices: Version 2.2

Block 16 - conversation buffer

Type / Role: @n8n/n8n-nodes-langchain.memoryBufferWindow - memoryBufferWindow
Config choices: Version 1.3

Block 17 - Deletes old records

Type / Role: n8n-nodes-base.supabase - supabase
Config choices: Version 1

Block 18 - Set the fields for mapping

Type / Role: n8n-nodes-base.set - set
Config choices: Version 3.4

Block 19 - Sticky Note1

Type / Role: n8n-nodes-base.stickyNote - stickyNote
Config choices: Version 1

Block 20 - When chat message received

Type / Role: @n8n/n8n-nodes-langchain.chatTrigger - chatTrigger
Config choices: Version 1.3

Block 21 - Code Tool

Type / Role: @n8n/n8n-nodes-langchain.toolCode - toolCode
Config choices: Version 1.3

Block 22 - Data Normalizer

Type / Role: n8n-nodes-base.code - code
Config choices: Version 2

Block 23 - Sticky Note2

Type / Role: n8n-nodes-base.stickyNote - stickyNote
Config choices: Version 1

Block 24 - Sticky Note3

Type / Role: n8n-nodes-base.stickyNote - stickyNote
Config choices: Version 1

3. Summary Table

Workflow	Build a website AI chatbot with lead capture using Gemini and Supabase RAG
Complexity	advanced
Nodes	24
Categories	Support Chatbot, AI Chatbot
Author	Shadrack
Published	30 Oct 2025

4. Reproducing the Workflow from Scratch

1. Download the workflow JSON

Use the JSON export at /data/workflows/10365/10365.json as the source template for this automation.
2. Import the template into n8n

Open n8n, import the downloaded JSON, and review each node before activating the workflow.
3. Configure credentials and variables

Replace placeholder credentials, API keys, webhook URLs, account IDs, and environment-specific values with your own settings.
4. Test with sample data

Run the workflow manually or in a staging workspace, inspect node output, and confirm downstream systems receive the expected data.
5. Activate and monitor

Enable the workflow only after testing, then monitor executions, errors, and rate limits during the first production runs.

5. General Notes & Resources

Review imported nodes carefully before activation. This catalog entry is intended to help you inspect the workflow structure, understand required services, and find related templates faster.

Node names, credentials, schedules, webhook paths, and external service limits may need adjustment for your workspace.

Download workflow JSON Original n8n.io source Support Chatbot workflows AI Chatbot workflows

Frequently asked questions

What does Build a website AI chatbot with lead capture using Gemini and Supabase RAG do?

What do I need before importing this workflow?

Review the workflow JSON, configure any required credentials in n8n, and test the automation in a safe workspace before using it in production.

Can I customize this workflow?

Yes. Use the block-by-block analysis and the downloadable JSON to inspect each node, then adjust credentials, prompts, schedules, filters, or destinations for your Support Chatbot, AI Chatbot use case.

Shadrack

7 workflows

Nodes

@n8n/n8n-nodes-langchain.lmchatgooglegemini n8n-nodes-base.googledrivetrigger n8n-nodes-base.googledrive @n8n/n8n-nodes-langchain.vectorstoresupabase @n8n/n8n-nodes-langchain.documentdefaultdataloader @n8n/n8n-nodes-langchain.textsplitterrecursivecharactertextsplitter n8n-nodes-base.stickynote n8n-nodes-base.splitinbatches

Complexity

advanced

Published 30 Oct 2025

Likes 0

View on n8n.io Download Workflow

Install path: /data/workflows/10365/10365.json

Share Your Workflow

Have a useful automation to share? Publish it and help the community.

Submit Your Template How to Submit

Related Workflows

Route RAG customer support across WhatsApp and Outlook with Pinecone and OpenRouter

## Quick overview A production-ready 3-workflow system that handles customer support across WhatsApp and Email using RAG-powered AI. Automatically routes queries, detects escalation intent, logs handoffs to Google Sheets, alerts your team via Slack, and lets agents resolve cases with a single slash command. ## How it works 1. A form trigger accepts PDF, DOCX, and TXT documents, chunks them with a token splitter, embeds them using Google Gemini, and stores them in your Pinecone vector store to build the AI knowledge base. 2. Incoming messages from WhatsApp Business Cloud API and Microsoft Outlook are each normalized into a unified contact format — capturing channel, contact ID, name, and message text — before merging into a single pipeline. 3. Every message is checked against a Google Sheets handoff tracker. If the contact is currently assigned to a human agent, the message is forwarded directly to Slack without any AI involvement. 4. For active (non-handoff) contacts, the AI Support Agent queries Pinecone via RAG, pulls context from a sliding conversation memory window, and returns a structured JSON output containing a reply and a handoff_requested flag. 5. If the AI detects escalation intent or has no answer, it sets handoff_requested: true — the contact is logged to Google Sheets, AI goes silent for that contact, and a detailed alert is posted to your Slack support channel. 6. Answers are routed back through the originating channel — WhatsApp replies via Business Cloud API, email replies via Microsoft Outlook — keeping every conversation native to its platform. 7. Support agents run /resolve [contact_id] in Slack to close a handoff. The workflow validates the input, updates the Google Sheets row with agent name and timestamp, re-enables AI for that contact, and confirms resolution in the Slack channel. ## Setup 1. Pinecone + Embeddings: Create a Pinecone index and add your Pinecone credential to the "Insert into Vector Store" and "Knowledge Base" nodes. Set your Google Gemini API credential on both Embeddings nodes (one in Workflow 1, one in Workflow 2). 2. WhatsApp: Connect your WhatsApp Business Cloud API credential to the WhatsApp Trigger node. Replace YOUR_WHATSAPP_PHONE_NUMBER_ID in both Send WhatsApp Message nodes. 3. Email: Add your Microsoft Outlook OAuth2 credential to the Outlook Trigger and the Send Email Answer node. 4. Handoff Sheet: Create a Google Sheet with a tab named Handoffs and these column headers exactly: contact_id | channel | contact_name | status | handoff_since | resolved_by | resolved_at. Set your Google Sheets credential and paste your Sheet ID into all four Google Sheets nodes across Workflows 2 and 3. 5. Slack: Create a Slack bot app, add it to your support channel, and set the credential in all three Slack nodes. Update the channel name if yours differs from #support-handoff. 6. AI Model: Add your OpenRouter (or OpenAI) API key to the Chat Model node. Swap the model slug in node settings as needed. 7. Slash Command: Activate Workflow 3 first to generate its production webhook URL. Then in your Slack app settings go to Slash Commands → Create New → set command to /resolve → paste the webhook URL → reinstall app to workspace. 8. Activate order: Workflow 1 (KB ingestion) → Workflow 3 (resolve handler) → Workflow 2 (main support flow). ## Requirements - n8n (self-hosted or cloud) - WhatsApp Business Cloud API account (Meta Developer App) - Microsoft 365 / Outlook account - Pinecone account - Google Gemini API key - OpenRouter or OpenAI API key or Any other LLM - Google Sheets - Slack workspace with a custom bot app ## Customization - Edit the system prompt in the AI Support Agent node to match your brand voice, support scope, and escalation rules - Swap Google Gemini Embeddings for OpenAI Embeddings — just replace the Embeddings node and ensure your Pinecone index dimensions match - dd more channels (Telegram, Instagram DM, etc.) by normalizing their payloads into the same contact format and feeding them into the Merge node - Adjust conversation memory window (default: 8 messages) in the Conversation Memory node - Trigger the resolve webhook from your CRM or helpdesk instead of Slack if preferred ## Additional info All three workflows must be active simultaneously for the system to function Handoff state is persisted in Google Sheets and survives n8n restarts or server reboots Once a contact enters handoff, the AI is completely silent for that contact — no accidental double-responses Document metadata (filename, uploader name, timestamp) is stored alongside vectors in Pinecone for full traceability Default chunk settings: 500 tokens / 100 overlap — tune in the Token Splitter node based on your document style Contact / Support 🔗 n8n Templates: n8n.io/creators/salmanmehboob 💼 LinkedIn: linkedin.com/in/salman-mehboob-pro 📧 Email: [email protected] 💬 WhatsApp: +92 306 746 6499

View

Answer hotel guest messages with GPT-4o mini, Slack, and Google Sheets

## Quick Overview This workflow receives guest messages via a webhook, uses OpenAI (GPT-4o-mini) to generate multilingual hotel support replies with an escalation flag, notifies the front desk in Slack when needed, logs the interaction to Google Sheets, and returns a JSON acknowledgement to the messaging gateway. ## How it works 1. Receives an inbound guest message through a webhook from a WhatsApp/Viber gateway. 2. Normalizes the incoming payload into a consistent structure (guest ID, channel, guest name, and message text). 3. Uses OpenAI (GPT-4o-mini) to generate a short reply in the guest’s language based on the built-in hotel information and outputs structured JSON with language, reply, category, and an escalate flag. 4. If the message needs human attention, posts the guest details and message to a Slack front-desk channel. 5. Routes the reply based on the reported channel and sends the generated reply text to Slack. 6. Appends the conversation data to Google Sheets and responds to the gateway with a JSON status including the detected language and whether it was escalated. ## Setup 1. Configure the inbound webhook URL in your WhatsApp/Viber gateway so it sends a payload containing at least channel, from, and text/message fields. 2. Add OpenAI API credentials for the GPT-4o-mini model. 3. Add Slack OAuth2 credentials and set the target channels for front-desk notifications and reply delivery. 4. Add Google Sheets OAuth2 credentials and update the spreadsheet/document ID and sheet tab used for logging.

View

Answer support questions from a knowledge base with OpenAI GPT-4o-mini

## Quick Overview This workflow powers a support chat experience that uses an OpenAI RAG agent with in-memory vector search to answer questions from a knowledge base, and includes a manual ingestion flow that fetches an external FAQ document, splits it into chunks, embeds it with OpenAI, and stores it for retrieval. ## How it works 1. Triggers when a new chat message is received. 2. Uses an OpenAI chat model with conversation memory to generate a support reply while following the system support guidelines. 3. Creates OpenAI embeddings for the user’s query and searches an in-memory vector knowledge base for the top matching snippets. 4. Uses the retrieved knowledge base content as a tool to ground the final answer and returns the response to the chat. 5. When run manually, fetches FAQ content from a specified URL via HTTP. 6. Splits the fetched text into chunks, converts it into documents, generates OpenAI embeddings, and inserts the vectors into the in-memory knowledge base for future queries. ## Setup 1. Add OpenAI credentials for both chat completions (GPT-4o-mini) and embeddings. 2. Update the source URL in the HTTP Request step (currently https://example.com/help-center/faq.txt) to point to your real FAQ/knowledge base content. 3. Run the manual ingestion flow once to populate the in-memory knowledge base before testing the chat trigger.

View

Need Custom Automation?

Get help designing a custom n8n workflow that connects your stack and fits your process.

Build a website AI chatbot with lead capture using Gemini and Supabase RAG

Workflow preview

Important notice

1. Workflow Overview

Best for

Tools used

Source and attribution

1.1 Workflow description

🎯 Core Features

⚙️ How It Works

Integrations:

🧩 Quick Setup Steps

Embed the Widget:

Connect Integrations:

1.2 Logical Blocks

2. Block-by-Block Analysis

Block 1 - Google Gemini Chat Model

Block 2 - Google Drive Trigger

Block 3 - Google Drive Trigger1

Block 4 - Download file

Block 5 - Supabase Vector Store

Block 6 - Default Data Loader

Block 7 - Recursive Character Text Splitter

Block 8 - Sticky Note

Block 9 - Knowledgebase

Block 10 - Loop Over Items

Block 11 - Embeddings OpenAI

Block 12 - Think

Block 13 - Calculator

Block 14 - Sticky Note5

Block 15 - Support Agent

Block 16 - conversation buffer

Block 17 - Deletes old records

Block 18 - Set the fields for mapping

Block 19 - Sticky Note1

Block 20 - When chat message received

Block 21 - Code Tool

Block 22 - Data Normalizer

Block 23 - Sticky Note2

Block 24 - Sticky Note3

3. Summary Table

4. Reproducing the Workflow from Scratch

1. Download the workflow JSON

2. Import the template into n8n

3. Configure credentials and variables

4. Test with sample data

5. Activate and monitor

5. General Notes & Resources

Frequently asked questions