{"id":21410,"date":"2019-06-11T06:23:47","date_gmt":"2019-06-11T05:23:47","guid":{"rendered":"https:\/\/developer.kore.ai\/?p=21410"},"modified":"2021-10-20T10:25:28","modified_gmt":"2021-10-20T09:25:28","slug":"prompt-editor","status":"publish","type":"post","link":"https:\/\/multisite.korebots.com\/v9-0\/docs\/bots\/bot-builder-tool\/dialog-task\/prompt-editor\/","title":{"rendered":"User Prompts"},"content":{"rendered":"<section class=\"l-section wpb_row height_auto\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_grid cols_1 laptops-cols_inherit tablets-cols_inherit mobiles-cols_1 valign_top type_default stacking_default\"><div class=\"wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><p>After creating an Entity, Confirmation, or Message node in the Dialog Builder, Kore.ai lets you do the following:<\/p>\n<ul>\n<li>Modify the default message or user prompt displayed to the end-user.<\/li>\n<li>Add new prompts or messages.<\/li>\n<li>Add channel-specific prompts or messages.<\/li>\n<\/ul>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h4>Prompt Types<\/h4>\n<p>Dialog Tasks support two types of user prompts:<\/p>\n<ul>\n<li><strong>Standard<\/strong>: The prompt defined when adding a node in Dialog Builder is the standard or default prompt. When multiple standard prompts are defined for a node, the Platform chooses a random one to display to the end-user.<\/li>\n<li><strong>Channel-Specific<\/strong>: Optionally, define user prompts for specific channels such as email, SMS, Twitter, and more. Different widgets can be used based on channels such as a slider for numbers, date and time picker, and range selectors.<\/li>\n<\/ul>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h4>Prompt Editor<\/h4>\n<p>The prompt editor has three tabs to offer the following features:<\/p>\n<ul>\n<li><strong>Simple<\/strong>: Basic editor controls and HTML to define and format the user prompt. Enter text, and then format it using buttons for bold, italics, header styles, hyperlinks, ordered and unordered lists, and inserting lines.<\/li>\n<li><strong>JavaScript<\/strong>: Advanced JavaScript editor to define, format, and render the user prompt.<\/li>\n<li><strong>Preview<\/strong>: View a sample of the rendered output message with markup as displayed to the end-user.<\/li>\n<\/ul>\n<p>Below is the JavaScript message from the <em>Book Flights<\/em> bot that presents the response from a weather API to the users in a custom format:<\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707085735\/userPrompt_editor-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-28395\" src=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707085735\/userPrompt_editor-1.png\" alt=\"\" width=\"1366\" height=\"768\" \/><\/a><\/p>\n<p>In the case of <strong>Error Prompts<\/strong>, if you have enabled the <em>Present Prompts<\/em> in the <strong>Order of Retries<\/strong> toggle, the handlebar icon will be visible before each error prompt message. You can use this to re-order the messages so that it is displayed in that sequence.<\/p>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h3><span class=\"ez-toc-section\" id=\"Configure_the_User_Prompt\"><\/span>Configure the User Prompt<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>You can add or edit the prompts or bot messages from the <strong>Component Properties<\/strong> tab of an Entity, Confirmation, or Message node.<br \/>\nIn the case of Entity and Confirmation nodes, you refer to Prompts whereas, for the Message node, they are referred to as Responses.<\/p>\n<ol>\n<li>On the dialog task builder, click the <strong>+<\/strong> icon next to the respective node for which you want to configure the prompts or responses.<\/li>\n<li>Select <strong>Confirmation (or Entity or Message) <\/strong>&gt; <strong>New Confirmation (or Entity or Message) Node<\/strong>.<\/li>\n<li>The <strong>Confirmation<\/strong> <strong>(or Entity or Message) <\/strong>window is displayed with the <strong>Components Properties<\/strong> tab selected by default.<\/li>\n<li>Under the <strong>User Prompts<\/strong> (or Bot Responses) section, click <b>Manage<\/b>.<br \/>\n<b>Note<\/b>: If you want to make text edits to the default sample message, modify the message directly in the text box and press <strong>Enter<\/strong>\u00a0without clicking <b>Manage<\/b>.<br \/>\n<a ref=\"magnificPopup\" href=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707090239\/userPrompt_manage.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-28398\" src=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707090239\/userPrompt_manage.png\" alt=\"\" width=\"727\" height=\"523\" \/><\/a><\/li>\n<li>Do one of the following:\n<ol>\n<li>To edit the default sample message by adding context object variables or javascript code, click the sample message. The Message editor opens.<\/li>\n<li>To add a new prompt message, click <b>Add Prompt Message\/Manage Prompts<\/b>. The Message editor opens.<\/li>\n<\/ol>\n<\/li>\n<li>In the <b>Channel <\/b>drop-down list,<b> All Channels<\/b> is the default value. To create a channel-specific message, select the channel from the list.<\/li>\n<li>On the Message Editor, the <b>Plain Text <\/b>tab is the default selection. If you want to compose a Javascript message, click the <b>JavaScript <\/b>tab.<a ref=\"magnificPopup\" href=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707090413\/userPrompt_js.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-28401\" src=\"https:\/\/s3-us-east-2.amazonaws.com\/kore-wordpress\/developer.kore.ai\/wp-content\/uploads\/sites\/22\/20210707090413\/userPrompt_js.png\" alt=\"\" width=\"1331\" height=\"613\" \/><\/a><b>Note<\/b>: You can use stored context variables with {{variable brackets}}. For example, &#8216;Hello {{context.session.UserContext.firstName}}. How can I help you?&#8217;<\/li>\n<li>Compose the message and click <b>Save<\/b>.<\/li>\n<\/ol>\n<p>To add any more bot responses, repeat from step 2b.<\/p>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h3><span class=\"ez-toc-section\" id=\"Plain_Text_Prompts\"><\/span>Plain Text Prompts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Use the <strong>Plain Text<\/strong> tab in the editor to compose the user prompts using basic editor controls and HTML. You can enter text, and then format the text using the formatting buttons for bold, italics, header styles, hyperlinks, ordered and unordered lists, and inserting a line.<\/p>\n<p>The plain text tab supports the following markups:<\/p>\n<table>\n<tbody>\n<tr>\n<th>Markdown<\/th>\n<th>Output<\/th>\n<\/tr>\n<\/tbody>\n<tbody>\n<tr>\n<td>#h1<\/td>\n<td>Heading One<\/td>\n<\/tr>\n<tr>\n<td>#h2<\/td>\n<td>Heading Two<\/td>\n<\/tr>\n<tr>\n<td>#h3<\/td>\n<td>Heading Three<\/td>\n<\/tr>\n<tr>\n<td>#h4<\/td>\n<td>Heading Four<\/td>\n<\/tr>\n<tr>\n<td>#h5<\/td>\n<td>Heading Five<\/td>\n<\/tr>\n<tr>\n<td>#h6<\/td>\n<td>Heading Six<\/td>\n<\/tr>\n<tr>\n<td>&#8220;`Hello&#8220;`<\/td>\n<td>\u00a0<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13620\" src=\"\/wp-content\/uploads\/sites\/22\/hello-1.png\" alt=\"\" width=\"221\" height=\"57\" \/><\/td>\n<\/tr>\n<tr>\n<td>*Bold*<\/td>\n<td><b>Bold<\/b><\/td>\n<\/tr>\n<tr>\n<td>~Italic~<\/td>\n<td><i>Italic<\/i><\/td>\n<\/tr>\n<tr>\n<td>[Link](http:\/\/www.google.com)<\/td>\n<td><a href=\"http:\/\/www.google.com\/\">Link<\/a><\/td>\n<\/tr>\n<tr>\n<td>![Image](https:\/\/kbob.github.io\/images\/sample-4.jpg)<\/td>\n<td>\u00a0<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-13621\" src=\"\/wp-content\/uploads\/sites\/22\/Image-2-300x225.jpg\" alt=\"\" width=\"300\" height=\"225\" \/><\/td>\n<\/tr>\n<tr>\n<td>Order<br \/>\n1. This is one<br \/>\n2. This is two<\/td>\n<td>Order<\/p>\n<ol>\n<li>This is one<\/li>\n<li>This is two<\/li>\n<\/ol>\n<\/td>\n<\/tr>\n<tr>\n<td>Bullet<br \/>\n* This is one<br \/>\n* This is two<\/td>\n<td>Bullet<\/p>\n<ul>\n<li>This is one<\/li>\n<li>This is two<\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td>Hi! This is<br \/>\n&gt;&gt;indented<\/td>\n<td><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-30936\" src=\"https:\/\/multisite.korebots.com\/v9-0\/wp-content\/uploads\/sites\/22\/Indentation-Formatting-Example.png\" alt=\"\" width=\"212\" height=\"49\" \/><\/td>\n<\/tr>\n<tr>\n<td>This is line ___<\/td>\n<td>This is line ___<\/td>\n<\/tr>\n<tr>\n<td>This is &lt;br&gt; new line<\/td>\n<td>This is<br \/>\nnew line<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h3><span class=\"ez-toc-section\" id=\"JavaScript_Prompts_or_Responses\"><\/span>JavaScript Prompts or Responses<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>On the <strong>JavaScript<\/strong> tab of the editor, you can add custom code to handle the user prompt\u00a0message using system and session variables. The following is a sample code for displaying the weather forecast for a location:<\/p>\n<pre class=\"toolbar:1 lang:default decode:true\">var loc=context.weatherapi.response.body.query.results.channel.item.condition.text.toLowerCase();\r\nprint(\"Here are the details:\\n\");\r\nif(loc.indexOf(\"clear\")&gt;=0)\r\n{\r\nprint('Its clear outside.');\r\n}\r\n else if(loc.indexOf(\"sunny\")&gt;=0)\r\n{\r\n    print(\"Its sunny outside\");\r\n}\r\nelse if(loc.indexOf(\"cloud\")&gt;=0)\r\n{\r\n    print(\"Its very cloudy day\");\r\n}\r\nelse if (loc.indexOf('snow')&gt;=0)\r\n{\r\n    print('Its snowy day');\r\n}\r\nelse if(loc.indexOf('rain')&gt;=0)\r\n{\r\nprint('Yes, it looks like rainy day.');\r\n}\r\nelse if(loc.indexOf('breeze')&gt;=0)\r\n{\r\n    print(\"It's very breezy out there.\");\r\n}\r\nelse if(loc.indexOf('wind')&gt;=0)\r\n{\r\n     print(\"It's very windy out there.\");\r\n}\r\nelse if(loc.indexOf('shower')&gt;=0)\r\n{\r\n    print(\"It showering outside.\");\r\n}\r\nprint(\"Weather condition: \" + context.weather +\"\\n\");\r\nprint(\"Updated at: \" + context.lastupdate+\"\\n\");\r\nprint(\"Temperature: \" + context.temp+\"\\n\");\r\nprint(\"Wind: \" + context.wind+\"\\n\");\r\nprint(\"Pressure: \" + context.pressure+\"\\n\");\r\nprint(\"Visibility: \" + context.humidity+\"\\n\");\r\nprint(\"Humidity: \" + context.visibility+\"\\n\");<\/pre>\n<p>For more information, see <a href=\"\/docs\/bots\/bot-builder-tool\/dialog-task\/using-session-and-context-variables-in-tasks\/\">Using Session and Context Variables in Tasks<\/a>.<\/p>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><div class=\"wpb_text_column\"><div class=\"wpb_wrapper\"><h3><span class=\"ez-toc-section\" id=\"Preview_the_Prompt_or_Response\"><\/span>Preview the Prompt or Response<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>On the <strong>Preview<\/strong> tab, you can view a sample of the rendered output message that is displayed to the end-user with markup. To render the output for the code involving context variables, define them to use the <strong>Key<\/strong> and <strong>Value<\/strong> boxes in the tab to render a valid sample output for preview.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Channel-Specific_User_Prompts\"><\/span>Channel-Specific User Prompts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>By default, the Dialog Tasks configures the standard user prompts for all channels. However, you can define a specific response for one or more channels to display to the end-user in that channel instead of the <strong>Default<\/strong> response.<br \/>\nTo define a channel-specific response, select a channel, for example, <strong>Kore.ai<\/strong>, and then define the user prompt on the <b>JavaScript <\/b>tab as needed. Only one response can be defined for each channel.<\/p>\n<p class=\"note\"><strong>Note:<\/strong>\u00a0Use the following keys to return default values for:<br \/>\n<span style=\"color: red; font-family: courier;\">response.message<\/span> &#8211; Returns the default message as a string.<br \/>\n<span style=\"color: red; font-family: courier;\">response.message.choices<\/span> &#8211; Returns the options choice or confirmation message types as an array.<\/p>\n<ul>\n<li><strong>Slack Channel Override Example<\/strong>\n<pre class=\"lang:default decode:true\">var message = {};\r\nvar attachments = [];\r\nvar attachment = {\r\n    'text': \"Exception occurred during API execution\",\r\n    'color': '#FFCC00',\r\n    'attachment_type': 'default'\r\n};\r\nattachments.push(attachment);\r\nmessage.attachments = attachments;\r\nprint(JSON.stringify(message));<\/pre>\n<\/li>\n<li><strong>FaceBook Channel Override Example<\/strong>\n<pre class=\"lang:default decode:true \">var message = {\r\n    text: response.message\r\n};\r\nvar buttons = [];\r\nfor (var i = 0; i &lt; response.choices.length; i++) {\r\n    var choiceItem = response.choices[i];\r\n    if (choiceItem.length &gt; 20) {\r\n        choiceItem = choiceItem.substring(\r\n            0, 18) + '..';\r\n    }\r\n    var element = {\r\n        content_type: 'text',\r\n        title: choiceItem,\r\n        payload: choiceItem\r\n    };\r\n    buttons.push(element);\r\n}\r\nmessage.quick_replies = buttons;\r\nprint(JSON.stringify(message));<\/pre>\n<\/li>\n<li><strong>Email Channel Override Example<\/strong>\n<pre class=\"lang:default decode:true \">var message = {};\r\nvar text = response.message + ' &lt;br&gt; ';\r\nfor (var i = 0; i &lt; response.choices.length; i++) {\r\n    text = text.concat(\r\n        '&lt;u&gt; + response.choices[i] + ' &lt;\r\n        \/u&gt; &lt;br&gt;');\r\n    }\r\n    message.text = text;\r\n    print(JSON.stringify(message));<\/pre>\n<\/li>\n<li><strong>SMS Channel Override Example<\/strong>\n<pre class=\"lang:default decode:true \">var message = {};\r\n    var indexArray = ['a', 'b', 'c',\r\n        'd', 'e',\r\n        'f', 'g', 'h', 'i', 'j',\r\n        'k', 'l', 'm', 'n', 'o',\r\n        'p', 'q', 'r', 's', 't',\r\n        'u', 'v', 'w', 'x', 'y',\r\n        'z'\r\n    ];\r\n    var text = response.message + '\\\\n';\r\n    for (var i = 0; i &lt; response.choices\r\n        .length; i++) {\r\n        text = text.concat(indexArray[i] +\r\n            ') ' + response.choices[\r\n                i] + '\\\\n');\r\n    }\r\n    message.text = text;\r\n    print(JSON.stringify(message));<\/pre>\n<\/li>\n<\/ul>\n<\/div><\/div><div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div><\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"After creating an Entity, Confirmation, or Message node in the Dialog Builder, Kore.ai lets you do the following: Modify the default message or user prompt displayed to the end-user. Add new prompts or messages. Add channel-specific prompts or messages. Prompt Types Dialog Tasks support two types of user prompts: Standard: The prompt defined when adding...","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[29],"tags":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/posts\/21410"}],"collection":[{"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/comments?post=21410"}],"version-history":[{"count":15,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/posts\/21410\/revisions"}],"predecessor-version":[{"id":30939,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/posts\/21410\/revisions\/30939"}],"wp:attachment":[{"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/media?parent=21410"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/categories?post=21410"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/multisite.korebots.com\/v9-0\/wp-json\/wp\/v2\/tags?post=21410"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}