How to add link in dialogflow custom payload

Hello everyone in this article we will see how add link in dialog flow custom payload. As we all know there is no option to directly give the link dialog flow we need to use the facility of custom payload if we want to mention the external link.

How to give link in dialog flow response

There is primitive way of giving custom link in dialog flow response it’s called as custom payload. We just can’t mention a link in natural response of the dialog flow and it will render it. The output will be blank or empty if we just mention the custom link without using custom payload.
So the best way will be to create custom payload in the form the JSON data which consists of “key value pairs ” where left hand side of the data represents the key and the right hand side of the state represents the value related to key.

Correct way of giving link in dialog flow

As we already discussed in order to give link we need to use custom payload which looks something like this

So now the correct way of JSON Data is shown in the below image. Not only link this code makes the link hidden by adding button like structure for the output response.

Here the “richContent” keyword indicates it’s custom payload JSON data. All JSON data is of the format array, where an array can have similar of different elements. Also JSON allows the use of object like structures inside the array strucutre.
Here the key values will be like “type“, which tells what typoe of information is being parsed in this JSON.
Next if we see in the above image we have “title” as the key which will be visible on the output response.
Now at the end for giving link we have a key called as “actionLink” which indicates the next string whatever is given it indicates the clickable link which will be redirecting to some other website or within website some other page.

How output Response look for this JSON Code

If we take a look at the final output which we will get after parsing the data through this above code the output will contain on e beautiful button on which the message which we are passing in title will be written and it will be a clickable button.

So as we can see there will a button and the title which we mention in JSON will be written on that button if we click on that button it will re-direct to respective websites.

JSON code for custom payload

{
  "richContent": [
    [
      {
        "type": "info",
        "title": "Click Here For Updates",
        "actionLink": "https://isitactually.com/"
      }
    ]
  ]
}

So finally, you can just copy the above code and add to your custom payload where you just need to replace the above link with yours. That’s it your all set for showing beautiful response to the end users.