Create AI-powered website chatbot with Langflow backend and custom branding
This workflow integrates a chatbot frontend with a backend powered by Langflow, a visual low-code AI development tool. The flow is triggered whenever a chat message is received via the n8n chatbot widget embedded on a website. It then sends the message to a Langflow flow for processing and returns the generated response to the user. --- How It Works 1. Chat Trigger: The workflow starts with a webhook trigger (`Whe
At a glance
Create AI-powered website chatbot with Langflow backend and custom branding is a ready-made n8n workflow you import as a workflow JSON file — no build required. It connects LinkedIn. It's free to download. Follow the 5-step import below to go live in minutes.
- Platform
- n8n
- Connects
- Modules
- 3
- Price
- Free
- Version
- v1.0

About this workflow
This workflow integrates a chatbot frontend with a backend powered by Langflow, a visual low-code AI development tool. The flow is triggered whenever a chat message is received via the n8n chatbot widget embedded on a website. It then sends the message to a Langflow flow for processing and returns the generated response to the user. --- How It Works 1. Chat Trigger: The workflow starts with a webhook trigger (When chat message received) that listens for incoming chat messages from the n8n Chat interface. 2. Langflow Integration: The chat input is sent to a Langflow instance via an HTTP request (Langflow node). The request includes the user's message and expects a response from the Langflow flow. 3. Response Processing: The output from Langflow is extracted and formatted using the Edit Fields node, ensuring the chatbot displays the response correctly. 4. Customization: Sticky notes provide instructions for embedding the n8n Chat widget on a website and customizing its appearance, including welcome messages, language settings, and branding. --- Set Up Steps 1. Configure Langflow Connection: - Replace LANGFLOWURL and FLOWID in the HTTP request node with your Langflow instance details. - Ensure the API headers (e.g., Content-Type: application/json) and authentication (if required) are correctly set. 2. Deploy n8n Chat: - Add the provided CDN script to your website, replacing YOURPRODUCTIONWEBHOOKURL with the webhook URL generated by the When chat message received node. - Customize the chatbot’s UI (e.g., title, placeholder text, initial messages) using the JavaScript snippet in the sticky notes. 3. Activate Workflow: - Toggle the workflow to "Active" in n8n. - Test the chatbot by sending a message and verifying the Langflow response is processed and displayed correctly. --- Advantages ✅ Seamless Langflow Integration It allows n8n to communicate directly with a Langflow flow via API, enabling AI responses using custom-designed Langflow logic. ✅ No-Code Chatbot Deployment With just a script snippet, the chatbot widget can be embedded into any website. Minimal coding is required to launch a fully functioning AI chatbot. ✅ Customizable UI/UX The included embed code offers full control over the chatbot's appearance, language, welcome message, input placeholder, and branding—ideal for white-label or customer-facing deployments. ✅ Modular and Extensible Because it's built in n8n, this chatbot can be easily extended with other services like CRMs, email alerts, or databases, without leaving the platform. ✅ Real-Time AI Interactions Thanks to Langflow's API and chat response support, users get immediate and dynamic AI-driven replies. ---- Need help customizing? Contact me for consulting and support or add me on Linkedin.
How to import this n8n workflow
- 1
Download the workflow JSON file after purchase.
- 2
Open n8n → click the menu → Import from File.
- 3
Select the downloaded JSON and import.
- 4
Set up credentials for each node that requires them.
- 5
Click Execute Workflow to test, then activate.
Setup guide
Setup guide included
Purchase to unlock the full step-by-step guide
Related N8n workflows
Summarize youtube videos from transcript for social media
Generate document drafts from PDFs using Google Drive, GPT-4 & notifications
Track Google rankings daily with Decodo and Google Sheets
Send cold outreach emails and follow-ups with Resend, Postgres and HubSpot
HubSpot Contact Enrichment with Lusha Auto-Lookup
Create Facebook posts and images with Google Gemini and Facebook Graph API
Analyze images from forms using GPT-4o-mini Vision and deliver to Telegram
Automatically create YouTube metadata with AI
Reviews
No reviews yet
Be the first to buy and share your experience.
Leave a review
Sign in to share your experience with this workflow.
Create a free account to purchase workflows.
- JSON blueprint — instant download
- Setup guide PDF included
- 5 downloads · valid 30 days
- Works with n8n
Need help setting this up?
Book a 3-hour live setup session with an Agility consultant.
- Configure live on Google Meet / Zoom
- Free follow-up if workflow has defects
- Platform expert assigned to you