Skip to main content

n8n Chatbot Example (Step-by-Step)

Learn how to build a complete chatbot workflow in n8n and connect it to the Tellflow mobile app.

Step 1: Create Your n8n Workflow​

1. The Webhook Trigger​

Add a Webhook node to your workflow.

  • HTTP Method: POST
  • Path: /chat-app
  • Response Mode: Respond to Webhook (Custom)
  • Select: session_id and message from the body.

2. Add an AI Agent (The Brain)​

Add an AI Agent or your preferred Chat Model node.

  • Prompt: Use {{ $json.body.message }} as the user input.
  • Memory: Use the Chat Memory node and set the Session ID to {{ $json.body.session_id }}.
  • Model: Connect your LLM (OpenAI, Anthropic, etc.).

3. Respond to the App​

Add a Respond to Webhook node.

  • Respond With: JSON
  • Response Body: 
    {
      "content": "{{ $json.output }}"
    }

Step 2: Configure Tellflow​

Now, open the Tellflow Mobile App:

  1. Go to the Workflows tab.
  2. Find your "My Chatbot" workflow in the list and tap it.
  3. Set the Webhook URL to your n8n webhook URL.
  4. Optionally, give it a name like "My n8n Sidekick".
  5. Save and start chatting!

Step 3: Adding Advanced Features​

1. Interactive Buttons (Fast Selection)​

To show buttons in the chat (e.g., "Yes", "No", "Tell me more"), your n8n response should look like this:

{
  "content": "Please choose an option:",
  "content_type": "input_select",
  "content_attributes": {
    "items": [
      { "title": "Buy Now", "value": "BUY" },
      { "title": "Free Demo", "value": "DEMO" }
    ]
  }
}

2. User Forms (Data Collection)​

To request information from the user (e.g., Email, Name), use the form type:

{
  "content": "Please fill out the form:",
  "content_type": "form",
  "content_attributes": {
    "items": [
      { "name": "email", "type": "email", "label": "Email", "placeholder": "email@example.com" },
      { "name": "name", "type": "text", "label": "Full Name", "placeholder": "John Doe" }
    ]
  }
}

[!TIP] When the user submits the form, Tellflow will send another POST request to your webhook with the results as a JSON map.

Why Use the Tellflow Node?​

We provide a custom Tellflow n8n Node that simplifies creating these interactive messages. Instead of manually writing JSON, you can use the node's visual editor to build buttons, forms, and cards.

  • TellFlow Interactive Message: A drag-and-drop tool to generate responses.
  • TellFlow Push Notification: Send push notifications to your device from any n8n workflow.