Clickable response such as a button in Dialgflow











up vote
0
down vote

favorite












I have been developing a chatbot for my android app using dialogflow and its working perfectly. But now I've a requirement to get a clickable response from my chabot. For example, let's say that the app user is asking for a specific location. I want Dialogflow chatbot to return a button or a link as the response so that the user could click on that and be redirected to the google maps.



I have went through a lot of tutorials, blogs and docs yet I've not been able to find a satisfying answer. If you could help me with a code example as well, that would be really appreciated.



Thank you in advance










share|improve this question


























    up vote
    0
    down vote

    favorite












    I have been developing a chatbot for my android app using dialogflow and its working perfectly. But now I've a requirement to get a clickable response from my chabot. For example, let's say that the app user is asking for a specific location. I want Dialogflow chatbot to return a button or a link as the response so that the user could click on that and be redirected to the google maps.



    I have went through a lot of tutorials, blogs and docs yet I've not been able to find a satisfying answer. If you could help me with a code example as well, that would be really appreciated.



    Thank you in advance










    share|improve this question
























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      I have been developing a chatbot for my android app using dialogflow and its working perfectly. But now I've a requirement to get a clickable response from my chabot. For example, let's say that the app user is asking for a specific location. I want Dialogflow chatbot to return a button or a link as the response so that the user could click on that and be redirected to the google maps.



      I have went through a lot of tutorials, blogs and docs yet I've not been able to find a satisfying answer. If you could help me with a code example as well, that would be really appreciated.



      Thank you in advance










      share|improve this question













      I have been developing a chatbot for my android app using dialogflow and its working perfectly. But now I've a requirement to get a clickable response from my chabot. For example, let's say that the app user is asking for a specific location. I want Dialogflow chatbot to return a button or a link as the response so that the user could click on that and be redirected to the google maps.



      I have went through a lot of tutorials, blogs and docs yet I've not been able to find a satisfying answer. If you could help me with a code example as well, that would be really appreciated.



      Thank you in advance







      android dialogflow






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 11 at 7:31









      Yashodha Pieris

      81




      81
























          2 Answers
          2






          active

          oldest

          votes

















          up vote
          1
          down vote













          If you are using Dialogflow to integrate with your own system (as opposed to something like Facebook Messenger, Actions on Google, or other bot platforms) using the Detect Intent API, then you can include any data you want in the payload object of your webhook response. This is passed back to you in the response to your Detect Intent call in the response body in the queryResult.webhookPayload object.



          You can include in here any information you wish, and render it however you'd like.






          share|improve this answer





















          • thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
            – Yashodha Pieris
            Nov 11 at 15:53










          • It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
            – Prisoner
            Nov 11 at 17:48


















          up vote
          0
          down vote













          You may have to use Google Maps URLs for this purpose. These provide a Universal Cross-platform solution.



          Follow these steps:



          Based on user Responses, encode a Map URL as shown in examples here https://developers.google.com/maps/documentation/urls/guide



          For example, consider the URL from the guide above



          https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY


          Then use
          Buttons in Basic Card as follows



          app.intent('demo', (conv, params) => {
          // Create a basic card with the URL
          conv.ask(new BasicCard({
          text: `This is a basic card with Map Response.`,
          subtitle: 'This is a subtitle',
          title: 'Title: Open Map',
          buttons: new Button({
          title: 'Open Map as per URL',
          url: 'https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY',
          })
          }));
          }


          You can also use other Responses (such as linkOutSuggestion ) as described here:
          https://developers.google.com/actions/assistant/responses



          Hope that helps!






          share|improve this answer





















          • Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
            – Yashodha Pieris
            Nov 11 at 11:32











          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














           

          draft saved


          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53246705%2fclickable-response-such-as-a-button-in-dialgflow%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown

























          2 Answers
          2






          active

          oldest

          votes








          2 Answers
          2






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes








          up vote
          1
          down vote













          If you are using Dialogflow to integrate with your own system (as opposed to something like Facebook Messenger, Actions on Google, or other bot platforms) using the Detect Intent API, then you can include any data you want in the payload object of your webhook response. This is passed back to you in the response to your Detect Intent call in the response body in the queryResult.webhookPayload object.



          You can include in here any information you wish, and render it however you'd like.






          share|improve this answer





















          • thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
            – Yashodha Pieris
            Nov 11 at 15:53










          • It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
            – Prisoner
            Nov 11 at 17:48















          up vote
          1
          down vote













          If you are using Dialogflow to integrate with your own system (as opposed to something like Facebook Messenger, Actions on Google, or other bot platforms) using the Detect Intent API, then you can include any data you want in the payload object of your webhook response. This is passed back to you in the response to your Detect Intent call in the response body in the queryResult.webhookPayload object.



          You can include in here any information you wish, and render it however you'd like.






          share|improve this answer





















          • thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
            – Yashodha Pieris
            Nov 11 at 15:53










          • It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
            – Prisoner
            Nov 11 at 17:48













          up vote
          1
          down vote










          up vote
          1
          down vote









          If you are using Dialogflow to integrate with your own system (as opposed to something like Facebook Messenger, Actions on Google, or other bot platforms) using the Detect Intent API, then you can include any data you want in the payload object of your webhook response. This is passed back to you in the response to your Detect Intent call in the response body in the queryResult.webhookPayload object.



          You can include in here any information you wish, and render it however you'd like.






          share|improve this answer












          If you are using Dialogflow to integrate with your own system (as opposed to something like Facebook Messenger, Actions on Google, or other bot platforms) using the Detect Intent API, then you can include any data you want in the payload object of your webhook response. This is passed back to you in the response to your Detect Intent call in the response body in the queryResult.webhookPayload object.



          You can include in here any information you wish, and render it however you'd like.







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 11 at 14:18









          Prisoner

          30.3k12551




          30.3k12551












          • thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
            – Yashodha Pieris
            Nov 11 at 15:53










          • It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
            – Prisoner
            Nov 11 at 17:48


















          • thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
            – Yashodha Pieris
            Nov 11 at 15:53










          • It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
            – Prisoner
            Nov 11 at 17:48
















          thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
          – Yashodha Pieris
          Nov 11 at 15:53




          thank you so much for your help @Prisoner. Could you give me a sample code on how to do what you suggested?
          – Yashodha Pieris
          Nov 11 at 15:53












          It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
          – Prisoner
          Nov 11 at 17:48




          It is difficult to provide you sample code since you haven't provided any to build from, so I'm not sure if you want sample code on the webhook fulfillment, in your client, etc.
          – Prisoner
          Nov 11 at 17:48












          up vote
          0
          down vote













          You may have to use Google Maps URLs for this purpose. These provide a Universal Cross-platform solution.



          Follow these steps:



          Based on user Responses, encode a Map URL as shown in examples here https://developers.google.com/maps/documentation/urls/guide



          For example, consider the URL from the guide above



          https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY


          Then use
          Buttons in Basic Card as follows



          app.intent('demo', (conv, params) => {
          // Create a basic card with the URL
          conv.ask(new BasicCard({
          text: `This is a basic card with Map Response.`,
          subtitle: 'This is a subtitle',
          title: 'Title: Open Map',
          buttons: new Button({
          title: 'Open Map as per URL',
          url: 'https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY',
          })
          }));
          }


          You can also use other Responses (such as linkOutSuggestion ) as described here:
          https://developers.google.com/actions/assistant/responses



          Hope that helps!






          share|improve this answer





















          • Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
            – Yashodha Pieris
            Nov 11 at 11:32















          up vote
          0
          down vote













          You may have to use Google Maps URLs for this purpose. These provide a Universal Cross-platform solution.



          Follow these steps:



          Based on user Responses, encode a Map URL as shown in examples here https://developers.google.com/maps/documentation/urls/guide



          For example, consider the URL from the guide above



          https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY


          Then use
          Buttons in Basic Card as follows



          app.intent('demo', (conv, params) => {
          // Create a basic card with the URL
          conv.ask(new BasicCard({
          text: `This is a basic card with Map Response.`,
          subtitle: 'This is a subtitle',
          title: 'Title: Open Map',
          buttons: new Button({
          title: 'Open Map as per URL',
          url: 'https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY',
          })
          }));
          }


          You can also use other Responses (such as linkOutSuggestion ) as described here:
          https://developers.google.com/actions/assistant/responses



          Hope that helps!






          share|improve this answer





















          • Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
            – Yashodha Pieris
            Nov 11 at 11:32













          up vote
          0
          down vote










          up vote
          0
          down vote









          You may have to use Google Maps URLs for this purpose. These provide a Universal Cross-platform solution.



          Follow these steps:



          Based on user Responses, encode a Map URL as shown in examples here https://developers.google.com/maps/documentation/urls/guide



          For example, consider the URL from the guide above



          https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY


          Then use
          Buttons in Basic Card as follows



          app.intent('demo', (conv, params) => {
          // Create a basic card with the URL
          conv.ask(new BasicCard({
          text: `This is a basic card with Map Response.`,
          subtitle: 'This is a subtitle',
          title: 'Title: Open Map',
          buttons: new Button({
          title: 'Open Map as per URL',
          url: 'https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY',
          })
          }));
          }


          You can also use other Responses (such as linkOutSuggestion ) as described here:
          https://developers.google.com/actions/assistant/responses



          Hope that helps!






          share|improve this answer












          You may have to use Google Maps URLs for this purpose. These provide a Universal Cross-platform solution.



          Follow these steps:



          Based on user Responses, encode a Map URL as shown in examples here https://developers.google.com/maps/documentation/urls/guide



          For example, consider the URL from the guide above



          https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY


          Then use
          Buttons in Basic Card as follows



          app.intent('demo', (conv, params) => {
          // Create a basic card with the URL
          conv.ask(new BasicCard({
          text: `This is a basic card with Map Response.`,
          subtitle: 'This is a subtitle',
          title: 'Title: Open Map',
          buttons: new Button({
          title: 'Open Map as per URL',
          url: 'https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393&query_place_id=ChIJKxjxuaNqkFQR3CK6O1HNNqY',
          })
          }));
          }


          You can also use other Responses (such as linkOutSuggestion ) as described here:
          https://developers.google.com/actions/assistant/responses



          Hope that helps!







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 11 at 11:08









          sai.raj

          838




          838












          • Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
            – Yashodha Pieris
            Nov 11 at 11:32


















          • Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
            – Yashodha Pieris
            Nov 11 at 11:32
















          Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
          – Yashodha Pieris
          Nov 11 at 11:32




          Thank you so much for your comment. But isn't basic card responses support only to existing clients like messenger, viber and etc? I have been looking around a lot and that's what I found out. Please correct me if I'm wrong.
          – Yashodha Pieris
          Nov 11 at 11:32


















           

          draft saved


          draft discarded



















































           


          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53246705%2fclickable-response-such-as-a-button-in-dialgflow%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Xamarin.iOS Cant Deploy on Iphone

          Glorious Revolution

          Dulmage-Mendelsohn matrix decomposition in Python