Tiledesk Developer Hub
WebsiteCommunityTutorialsGet started
  • Introduction
  • Community
  • Ask for Support
  • Public Roadmap and Changelog
  • Tutorials
  • Widget
    • Widget SDK
    • Javascript API: Methods
    • Javascript API: Attributes
    • Javascript API: Listeners/Events
    • Widget Authentication
    • Widget Angular integration
    • Widget React integration
    • Widget for Android with WebView
    • Widget for iOS with WKWebView
    • Widget for Flutter with WebView
    • Widget for React with WebView
    • Widget for Wix Website platform
    • Tutorials
      • Hide widget
      • Show/Hide widget programmatically
      • Force widget loading without user interaction
      • Mobile positioning
      • Custom size (width/height)
      • Installing widget on selected pages
    • Conversation Embedded Apps
      • Payment App Tutorial
      • Prechat form App Tutorial
    • Advanced
      • Preset the Widget on a specific Department
      • Authentication Flow
      • Widget protocol specs
      • Prechat Form JSON specs
      • Prevent multiple conversations
      • Old versions
        • Web SDK v4
  • External Chatbot
    • Introduction
    • Hello World tutorial
    • Chatbot to Human handoff
    • Send Text Buttons
    • Advanced Tutorials
      • Introduction
      • Tutorial 1 - Dialogflow as external chatbot
      • Tutorial 2 - Buttons and images
      • Tutorial 3 - Automatic human handoff with fallback intent
      • Tutorial 4 - Explicit Human handoff with user intent
      • Tutorial 5 - Gracefully handling operating hours during handoff
      • Generate Dialogflow Google Credentials file
    • Rasa tutorials
      • Rasa Tutorial 1 - Rasa as external chatbot
  • Resolution bot
    • Introduction
    • Quickstart
    • Webhook service
    • Rich messages
    • Tutorials
      • Chatbot chooser (multilanguage)
      • Department chooser
      • Order info (webhook)
  • APIs
    • REST APIs
      • Introduction
      • Authentication
      • Requests
      • Leads
      • Messages
      • Activities
      • Projects
      • Team
      • User
      • Analytics
      • Canned responses
      • Tags
      • Events
      • Jwt
      • Labels
      • Images
      • Files
      • Segments
      • Chatbots
      • Knowledge Bases
        • Knowledge Base
        • Contents
        • Question & Answer
      • Management Api
        • Departments
        • Groups
    • NodeJS SDK
    • Webhooks
      • Subscriptions
    • Conversation Messages APIs tips
    • Realtime API
    • JWT Authentication
      • JWT Custom authentication Tutorial
    • Tutorials
      • REST API
        • Sending and receiving messages with Tiledesk APIs
        • PHP Tiledesk REST API example
        • Import multiple messages into Tiledesk using REST APIs from third party app
      • Webhooks
        • Custom Request assignment
        • Request transcript on close
  • Apps
    • Build Custom App - Quick start
    • External Channels integration flow diagram
    • Telegram integration tutorial
  • Dashboard & AgentChat SDK
    • Dashboard SDK
    • Agent Chat SDK
  • Architecture
    • Architecture overview
    • Components list
    • Bot Design diagram
    • Multi Channel Message Flow
  • Installation
    • Installation
    • Running Tiledesk using Docker Compose
    • Running Tiledesk with Kubernetes using Helm
    • Choosing Hardware
  • Configuration
    • Chat21 channel configuration
    • Email parameters and templates configuration
    • Configure the logging system
Powered by GitBook
On this page
  • Create your project
  • Import your chatbot
  • Configure your webhook endpoint
  • Custom attributes - Get info from the widget page

Was this helpful?

  1. Resolution bot
  2. Tutorials

Order info (webhook)

PreviousDepartment chooserNextREST APIs

Last updated 1 year ago

Was this helpful?

In this tutorial you will learn:

  1. how to pass chatbot attributes to your webhook APIs

  2. How to use custom attributes to pass info from your Web page through the Widget

Create your project

Import your chatbot

Go to the tutorial example chatbot on the Chatbot's Community:

Import the chatbot with the "Import Chatbot" button

Go on the "order info" block:

image

This block is connected to a webhook.

Configure your webhook endpoint

Go on replit and fork our chatbot backend demo, written in NodeJS, from this URL:

Get the app public endpoint:

Go in the Fulfillment section here and set the tutorial endpoint:

Press update bot.

Now press "Test it out" to see the chatbot in action:

Invoke the order info pressing the button:

Reply "123" when asked:

The backend will reply correctly with the order status (using the nodeJS app)

As you can see "fullname" is not populated. We left this on purpose unfulfilled.

Custom attributes - Get info from the widget page

Sometimes you need to get some info from outside of the chatbot environmet. Fro example, in this case, some info are only available in the web page osting the widget.

Go in this example HTML page, clone it and replace projectId with your own:

To pass custom attributes use the synthax highlithed:

This attributes will be automatically passed in all webhooks. You can get those properties through the "variables" map, or you can just leave Tiledesk chatbot automatically fulfill them, as in our example.

To try the fulfullment, connect the chatbot to the defaul department, to make it available as soon as you start a conversation:

Now launch the page:

Et voilà, also the fullname is fulfilled now!

Happy coding with Tiledesk Chatbot!

image

https://replit.com/@tiledesk/chatbot-order-info-webhook#index.js
https://chatbot-order-info-webhook.tiledesk.repl.co
https://replit.com/@tiledesk/Tiledesk-HTML-Site#custom-attributes.html
https://tiledesk-html-site.tiledesk.repl.co/custom-attributes.html
https://tiledesk.com/community/search/getchatbotinfo/chatbotId/64142f4138a332001a9605ac-Webhook-chatbot
image
image
image
image
image
image
image
image
image