{"id":1599,"date":"2022-10-28T14:15:57","date_gmt":"2022-10-28T12:15:57","guid":{"rendered":"https:\/\/botnation.ai\/add-buttons-web-chatbot\/"},"modified":"2026-01-02T15:27:41","modified_gmt":"2026-01-02T14:27:41","slug":"add-buttons-web-chatbot","status":"publish","type":"support","link":"https:\/\/botnation.ai\/en\/support\/add-buttons-web-chatbot\/","title":{"rendered":"Add buttons (Web Chatbot)"},"content":{"rendered":"<p>Add action buttons to your web chatbot<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/image-58.png.webp\" alt=\"buttons\" class=\"wp-image-1601\"><\/figure>\n<\/div>\n\n\n\n\n<h2 class=\"wp-block-heading\">1. Use<\/h2>\n\n\n\n<p>There are two different ways to create a button.<\/p>\n\n\n\n<p>The first is to add this feature directly by clicking on the \u201cbutton\u201d icon among the other features. (See below).<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_00_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1604\"><\/figure>\n\n\n\n<p>The second way is to create a<a href=\"https:\/\/botnation.ai\/en\/add-a-text-to-your-chatbot\/\"> text<\/a> and then transform this text into a button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_00_UK_bis-1024x604.png.webp\" alt=\"\" class=\"wp-image-1606\"><\/figure>\n\n\n\n<p>In the end you will have the same result:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/image-63.png.webp\" alt=\"\" class=\"wp-image-1674\" style=\"width:314px;height:299px\"><\/figure>\n<\/div>\n\n\n<p>The Button feature always consists of a text (limited to 640 characters) and a maximum of three buttons.<\/p>\n\n\n\n<p>To set up a button, click on<strong>\u201c+ Add a button<\/strong>\u201c.<br><br>You can then name the button (25 characters max).<br><br>Then, you will have the possibility to choose the type of action that the chatbot will perform when the user clicks the button.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">A. Redirection<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_01_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1610\"><\/figure>\n\n\n\n<p>This will redirect your users to another sequence. <br>See the article : <a href=\"https:\/\/botnation.ai\/en\/add-a-redirection\/\">Add a redirection<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">B. Internet<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_02_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1612\"><\/figure>\n\n\n\n<p>Your chatbot bot will redirect your users to a website.<\/p>\n\n\n\n<p><strong>You have several options for opening the site:  <\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>New tab<\/li>\n\n\n\n<li>Current tab<\/li>\n\n\n\n<li>Small popup<\/li>\n\n\n\n<li>Big popup<\/li>\n<\/ul>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>TIP<\/strong><br><em>Remember to put the http:\/\/ or https:\/\/ in front of the address otherwise it will not work.  <\/em><\/p>\n<\/blockquote>\n\n\n\n<h4 class=\"wp-block-heading\">C. Phone call<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_03_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1614\"><\/figure>\n\n\n\n<p>Your users will be able to call directly by clicking the button. This means that if a phone call application is available, it will automatically initiate the call.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>TIP<\/strong><br><em>Remember to put the country code before the number. Example for France +33 so the number will be +33162635447 and not 0162635447.  <\/em><\/p>\n<\/blockquote>\n\n\n\n<h4 class=\"wp-block-heading\">D. E-mail<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_04_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1616\"><\/figure>\n\n\n\n<p>Your users will be able to initiate an e-mail directly by clicking the button. This means that if an emailing application is available, it will create a new email with the email configured in the button as recipient.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">E. User input<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_05_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1618\"><\/figure>\n\n\n\n<p>This action allows the chatbot to save a value for a given variable when the user clicks the button.<br>This is very useful to keep track of your users\u2019 choices.<br>See the following article: <a href=\"https:\/\/botnation.ai\/en\/?p=602\">All about {{\u2026}} variables<\/a><br><br><strong>The parameters of this action are :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Name of the variable<\/li>\n\n\n\n<li>Value of the variable<\/li>\n\n\n\n<li>Redirection sequence<\/li>\n<\/ul>\n\n\n\n<p>See the article : <a href=\"https:\/\/botnation.ai\/en\/user-input\/\">User input<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">F. Stripe<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_06_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1620\"><\/figure>\n\n\n\n<p>You can bill for digital goods (content, online training, ticketing, etc..) or physical goods using your Stripe account natively linked to your Botnation chatbot.<br><br>Once you have configured the Stripe plugin in the chatbot settings you will have the option to <strong>set up a Stripe buy button<\/strong>.<\/p>\n\n\n\n<p><strong>To set it up, there are several fields to fill in:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The name of the product to be sold<\/li>\n\n\n\n<li>The price of the product<\/li>\n\n\n\n<li>Product currency<\/li>\n\n\n\n<li>The redirection sequence in case of a successful purchase<\/li>\n\n\n\n<li>The redirection sequence in case of purchase failure<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">G. GPS<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_07_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1622\"><\/figure>\n\n\n\n<p>When the button is clicked, a popup window will open with a map and the user will be able to choose his location and validate it.<br><br><strong>The parameters of this action are :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Button color<\/li>\n\n\n\n<li>Redirection sequence after validation<\/li>\n\n\n\n<li>Popup type: small, large or full screen<\/li>\n<\/ul>\n\n\n\n<p><strong>The following variables will be updated with the user\u2019s details:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>{{GPS_CITY}} : the city<\/li>\n\n\n\n<li>{{GPS_COUNTRY}} : the country<\/li>\n\n\n\n<li>{{GPS_ADDRESS}} : the address<\/li>\n\n\n\n<li>{{GPS_REGION}} : the region<\/li>\n\n\n\n<li>{{GPS_LAT}} : the latitude<\/li>\n\n\n\n<li>{{GPS_LONG}} : the longitude<\/li>\n<\/ul>\n\n\n\n<p>See the article: <a href=\"https:\/\/botnation.ai\/en\/gps-functionality-web-chatbot\/\">GPS feature (Web Chatbot)<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">H. Choice list<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_08_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1624\"><\/figure>\n\n\n\n<p>When the button is clicked, a popup window will open and display the different choices in the form of buttons.<\/p>\n\n\n\n<p>There is no limit to the number of choices or to the number of characters of the choices.<br>This can be useful to display a large list of countries or a list of questions for an FAQ.<br><br>The choices are displayed one below the other.<\/p>\n\n\n\n<p><strong>The parameters of this action are :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Text displayed above the list<\/li>\n\n\n\n<li>Button color<\/li>\n\n\n\n<li>Name of the variables<\/li>\n\n\n\n<li>List of choices (by default the variable will take the name of the choice as value)<\/li>\n\n\n\n<li>Possibility to enter values different from the name of the choice<\/li>\n\n\n\n<li>Redirection sequence<\/li>\n\n\n\n<li>Popup type: small, large or full screen<\/li>\n<\/ul>\n\n\n\n<p>See the article: <a href=\"https:\/\/botnation.ai\/en\/the-weblist-web-chatbot\/\">The weblist (Web Chatbot)<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">I. Date and Time<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_09_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1626\"><\/figure>\n\n\n\n<p>When the button is clicked, a popup window will open and display a calendar and\/or a clock that will allow the user to choose a date and\/or a time.<\/p>\n\n\n\n<p>The data will be saved in the format chosen in the variable {{CALENDAR_CUSTOM_FORMAT}}<\/p>\n\n\n\n<p><strong>The parameters of this action are :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Text displayed in the title of the popup<\/li>\n\n\n\n<li>Button color<\/li>\n\n\n\n<li>Possibility to request the date and\/or time<\/li>\n\n\n\n<li>Possibility to determine a minimum date\/time<\/li>\n\n\n\n<li>Possibility to determine a maximum date\/time<\/li>\n\n\n\n<li>Possibility to choose a default Date\/Time<\/li>\n\n\n\n<li>Choice of the hour increments: free, 5, 15 or 30 minutes<\/li>\n\n\n\n<li>Customization of the date\/time format<\/li>\n\n\n\n<li>Redirection sequence<\/li>\n\n\n\n<li>Popup type: small, large or full screen<\/li>\n<\/ul>\n\n\n\n<p>See the article: <a href=\"https:\/\/botnation.ai\/en\/capture-a-date\/\">Capture a date<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">J. Multiple choice<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/botnation.ai\/wp-content\/uploads\/2022\/10\/B_W_10_UK-1024x604.png.webp\" alt=\"\" class=\"wp-image-1628\"><\/figure>\n\n\n\n<p>When the button is clicked, a popup window will open and display the different choices to be checked as well as a Validation button.<\/p>\n\n\n\n<p>There is no limit to the number of choices or to the number of characters of the choices.<\/p>\n\n\n\n<p>Each choice is associated with a different variable that will take the value 1 if it is checked or 0 if it is not.<\/p>\n\n\n\n<p><strong>The parameters of this action are :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Text displayed in the title of the popup<\/li>\n\n\n\n<li>Button color<\/li>\n\n\n\n<li>Minimum number of choices the user will have to make<\/li>\n\n\n\n<li>Maximum number of choices the user will have to make<\/li>\n\n\n\n<li>The choices and their variables<\/li>\n\n\n\n<li>Redirection sequence<\/li>\n\n\n\n<li>Popup type: small, large or full screen<\/li>\n<\/ul>\n\n\n\n<p>See the article: <a href=\"https:\/\/botnation.ai\/en\/the-multiple-choice-list-web-chatbot\/\">The multiple choice list (Web Chatbot)<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2. Options<\/h2>\n\n\n\n\n","protected":false},"featured_media":0,"template":"","meta":{"_acf_changed":false},"categorie-support":[194,222,221],"class_list":["post-1599","support","type-support","status-publish","hentry","categorie-support-features","categorie-support-variables-en","categorie-support-web-chatbot-en"],"acf":[],"_links":{"self":[{"href":"https:\/\/botnation.ai\/en\/wp-json\/wp\/v2\/support\/1599","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/botnation.ai\/en\/wp-json\/wp\/v2\/support"}],"about":[{"href":"https:\/\/botnation.ai\/en\/wp-json\/wp\/v2\/types\/support"}],"wp:attachment":[{"href":"https:\/\/botnation.ai\/en\/wp-json\/wp\/v2\/media?parent=1599"}],"wp:term":[{"taxonomy":"categorie-support","embeddable":true,"href":"https:\/\/botnation.ai\/en\/wp-json\/wp\/v2\/categorie-support?post=1599"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}