How to integrate Dialogflow with your Chatbot

Creating smart chatbots is easier than you might think. 

You do not have to know any coding to allow chatbots to respond with intuitive and smart responses. In this guide I am going to show you how you can use Dialogflow to do the hard work for you.


Let's get started! 

What are we going to cover?

The platform build by Google is an NLP and this stands for Natural Language Processing. It means that Dialogflow can be trained to understand the input people give inside a chatbot and give a proper response which seems natural and you could expect a human would give. 

This adds tremendous value to your business since you now have a way to upgrade your chatbot to respond just like you would. 

It will also build a better relationship with your (potential) customers since you are providing relevant replies and content. 

So adding the power of Dialogflow to your chatbot will be one of the best things you can do to serve your clients better.

First step in integrating Dialogflow with your chatbot will be to create an account. You can do that at the login page of Dialogflow.

You will need to login to a Google Account. If you do not have one yet you can create one within just a few minutes at Google. after you logged in you will get to the Dialogflow Dashboard. 

The process of signing up or logging will look like this;

In order to train Dialogflow you will need to create an Agent. You will find this option on the left side in the menu

From here you will get to create your agent. When giving it a name do keep in mind that you cannot have any whitespaces in between.

You can also select your language and time zone so it matches you perfectly. 

Last thing you could set is creating a mega agent which allows you to also manage sub agents but in most cases this is not needed. Once done press the button Create.

Now that you set up your Dialogflow account it is time to connect it to your chatbot. 

I am using SilFer Bots so I will show you how to integrate it with this platform. It is really easy to do in just a few steps.

First thing you need to do is to go to Menu > Settings > Integrations 

From here you search the list for Dialogflow and press the connect button. You will select your Google account with which you created the Dialogflow agent. afterwards you select the training agent and when doing so SilFer Bots will complete the integrations for you. 

Here is how that looks like;

Now that the connection is completed and you can use Dialogflow with your chatbot, the next step is to train your Dialogflow agent to understand the context of the messages that people send to your chatbot. 

To do this we are going back into the dashboard of Dialogflow and create an intent. This is the section where we will be able to train our agent. 

When we press towards intents you will see two intents already created by Dialogflow itself. 

The default fallback intent is in place whenever Dialogflow is not able to understand the message a person sends through the chatbot. It has pre trained replies asking the person to rephrase the question or message in the hopes that the next message sent will make sense to Dialogflow. 

When integrating with SilFer Bots you can remove this intent because SilFer Bots has its own fallback message called the default reply.

You can remove an intent by hovering over it and select the trash bin icon

Now that we have removed the default fallback intent let's take a look at how the welcome intent looks like so we can understand how an intent is built.

Let's see how an intent looks like by clicking the existing Default Welcome Intent. 

You will get to see several sections

First thing you can change or create is the Intent's name. You can be as detailed here as possible as your intents will grow over time and you will want to quickly identify the correct intent when needed. 

Then next you will be able to set context. These are saved parameters from other intents that can be used to follow up in new intents. This is more of an advanced set up that most people do not need at this point. 

Next section is events. You can assign these to intents as a way to trigger them without a person messaging the page. SilFer Bots has a native integration you can use to trigger intents by using starting it by events-

Then we come to the part of training phrases which is the most important part of the intent. It allows Dialogflow to understand the nature of person message to your chatbot. 

When creating an intent always try to provide as many combination or variations of sentences as possible. Dialogflow can then also understand any combination of those sentences and let your chatbot respond the way you like. 

Then we come to the lower half of the intent section.

The section Action and Parameters is the part where you can store certain values that a person might give you inside the chatbot. 

For example if someone messages your chatbot with the following:

"I would like to make an appointment for next Friday on 2pm"

Dialogflow is then able to save the values next Friday and 2pm to system variables. You can then set it to be required by hitting the checkbox, give it a parameter name and write a sentence if a value is missing. 

So an example could be:

"I would like to make an appointment for next Friday"

Here we only have the date but not the time. We can then request it by setting it to required. More on this setup later on when we are going to start creating our own intent.

The next section is called Responses and here is how you will set how the chatbot will respond. 

In the Default Welcome Intent you can see there are text responses set up. You can do this directly inside of Dialogflow and there is no need to go to your chatbot platform to set the response. 

But you can also set up something that is called Custom Payload. 

It sounds like you will need to do some coding for this or hire a developer, but I promise it is pretty easy 😁

So to go a bit deeper into this we are going to create our very own intent.

So now we get to the fun stuff and that is creating our own intent so we can send a personalized response toward the person that messaged your chatbot. 

Let's create an intent that will allows the chatbot to respond when a person wants to make a booking.

To create a new intent press the + icon next to the Intent inside the left hand menu and let's call this Intent Booking.

Now we are going directly to training phrases and skipping the first two section. Press the link Add Training Phrases. 

Let's insert 1 training phrase like "I want to make an appointment for Wednesday at 3pm" and see what happens.

Soon as you give some valuable data like a day and time you will see that Dialogflow can recognize this and marks by coloring it. 

In the section Action and parameters you also notice an entry has been made and the data is recognized as @sys.date-time.

This means you can store the values that an user gives you and use that in the automated conversation you have with them. 

First option you have is to check this as a required input. What this does for the intent is whenever a person states he or she wants to make an appointment the intent will check if it is given a date and time as well. If not we will request for it. 

The next option is to edit the Parameter Name. This is a great and amazing feature when you connect with SilFer Bots because changing this name to the exact name of your custom field in SilFer Bots will sync the data that Dialogflow receives. 

So data captured in Dialogflow will now sync to the custom field of your choice.

Next option is the Entity name. This is the system variable that is equal to the custom field in SilFer Bots. 

The value is the value you can use in the conversation you set up with the text response option inside the Response Section.

Now let's make this value required by checking the box and then set the question to ask for it if needed.

I will also create some more training phrases so I know for certain that Dialogflow will understand the input sent by the user.

We are almost set. The only thing left to setup is the response we will give the user. 

We have two options to choose from:

The text response is very easy to set up. Just like inserting the training phrases you can insert your responses as well. You can provide as many as you like to provide a variety of responses. 

Dialogflow will randomize between the responses you have set up to give more of a reply as a human would give.

So let's set up a few responses.

In the text responses you will notice that I am using the value input that is set up in the Actions and Parameters section above. This is to display the value captured inside the entity we assigned earlier.

I just set up 3 responses for example purposes but you can add as many as you like.

Now let's see how this looks like inside the chatbot itself;

As you can see we get one of the responses set up in Dialogflow and the value $date-time is being populated with the value given by the user. 

I inserted Wednesday 3pm and Dialogflow automatically converts this to a date and time for us. Now if you would like to format the date and time to your own format that is not possible in Dialogflow, but we can do so inside of SilFer Bots. 

For that option we need to select Custom Payload instead of a Text Response.

Another way to send responses is to let Dialogflow send a flow you set up in SilFer Bots instead of a text response. This gives you much more flexibility since it will allow you to send more than just text. Think of sending videos, images, gifs but also more advanced responses. 

So to set this up we are going to delete the text responses and choose the Custom Payload option.

Now when selecting the custom payload function you will get a sort of code format with two curly brackets: {}

This is called a JSON format. Again may look very scary and developer like but it is actually very easy to implement. 

Before we can continue here we need to go to SilFer Bots and set up our flow that will have our response in it. 

So let's do that now.

In order for us to create the flow I am already assuming you created your account over at SilFer Bots, so I will skip that part.

Just go to menu in the left hand side and choose flows. From there you will press the button add flow and give it a name. Once done press the button continue to go into the flow builder to start and create the flow. 

Once inside the flow builder we want to send the message asking if the giving time and date is correct for them. For this we will use an user input field which will capture the response.

In order to do that we first need to sync the data captured in Dialogflow with SilFer bots. 

Remember when at the Actions and Parameters section I mentioned that when you make the Parameter name the same as the name of your custom field. 

Currently it is set as date-time so let's create the custom field inside of SilFer Bots. We can do that right inside the flow builder so no need to go to the custom field section for this. 

Just take an action block and use the action set custom field. Once loaded we will choose the option create new. 

Now that the custom field has been created we can go and create the message. 

Use an user input block and let's type something like "Hi {{first_name}} to confirm you want to make an appointment at {{date-time}}?

Let's choose the user input type multiple choice and set two answers to give. 

One will be "Yes correct" and "no change pls"

You can now drag the multiple choice options to a desired outcome. This way you will be able to give a customized response 

The only thing left now is to connect this flow with Dialogflow. To do that we are going to grab the step id of the starting step. just hover over the block and you will see a blueprint icon appearing. 

Press this and you will automatically copy the step id to your clipboard.

So we are almost done. We have set up all the steps inside the chatbot and now need to connect that to Dialogflow. 

Before I showed you how to remove the text responses in Dialogflow and how to choose the option Custom Payload. So let's use that right now. 

So as explained earlier the custom payload is in a JSON format. That means that you start with an open curly bracket: {

And then end with a closing curly bracket: }

In between we have the actual code. JSON works with keys and values, meaning the first part is set as the name of the key, and the second part is the value that key has.

So an example is;

{
"key":"value"

To make a connection with SilFer Bots you will set it up as follow;

{
"flow": your_step_id_here (for the value when it is numerical there is no need to put it between " ")
}

So if your step id you copied is 15646846512 it would be;

{
"flow":15646846512
}

Once done do not to forget to press save in the top right corner and also don't forget to press publish on the flow you setup in SilFer Bots to make sure both platforms have a live version you can test

Once this is done we are now ready to test our fully customized set up from Messenger to Dialogflow > SilFer Bots > Back to Messenger. 

You ready?

Let's do it!

So let's go back to Messenger and test out our newly created automation and see if we were able to sync the data that is captured in Dialogflow and save into custom fields inside of SilFer Bots.

Perfect! 

Dialogflow understood what I wanted to do here and also was able to convert my preferred time and date to the correct format. 

So things might seems very difficult but if you follow this step by step guide it really is not that hard right?

Some time ago I also recorded a similar video on my channel that you can watch if you prefer a more visual tutorial. You can watch that by pressing here.

If you like this kind of content or want to get notified when more videos like guides as above go live you can also subscribe to the channel. It would help me out and I would really appreciate it 😁

Let me know if you found this step by step guide useful below. Same goes for any kind of questions you might have