Power Platform Chatbots: NO CODE, Convert your website’s FAQs into a multi language chatbot, embed on your website and Verify User Input data

I am often asked by clients for solutions to reduce number of customers calls and emails to their call centers related to inquiries, help or queries. The increase in number of calls also require more staff to be hired.

In my experience most of my clients who already have websites, they try to put as much FAQs as they could to avoid customers queries. But still FAQs are not found to be a quick or easy way for users to get help or get answers for their queries.

In this article I will show you,

  1. How easy it is to convert your website’s FAQs into a live chatbot using Power Virtual Agent,
  2. Embed this bot on your web page without any code.
  3. Further I will show how you can verify data input by customers with just two lines of simple Odata queries in MS Automate Flow.

1.      Convert website’s FAQ into a Chat bot

You need to have Power Platform license. If you don’t have you can start by creating office 365 trial on this URL. Https://Portal.office.com. You can follow instructions in below URL to setup power apps environment. https://docs.microsoft.com/en-us/power-platform/admin/create-environment

In this article I will create bots for English and Spanish FAQs

Once trial created then click on chatbots on left side menu.

No alt text provided for this image

Click on basic conventional bot

No alt text provided for this image

It will redirect you to the Power Virtual Agent page shown in image below. Give a name to your bot and select English as language. You can see that there are options for other languages too. There are 15 languages available up to date including three experimental languages.

No alt text provided for this image

It will take few minutes and then your chatbot will be ready. Click on Topics on the left side and then select Suggest Topics on Right. You will see some topics already created for your bot.

No alt text provided for this image

“Topics” is the data which Bots use to understand the meaning of user input and appropriately give the options or answer to the user.

In this article I will use a website FAQs as topics and provide that to our bot. In the snapshot below all we have to do is to give URL of our website’s FAQ. Such as I have used MS support website FAQ URL which is in English.

https://www.microsoft.com/en-us/software-download/faq

No alt text provided for this image

After clicking on Add and then start will show you the message as shown in Image below. It will take sometime.

No alt text provided for this image

Behind the scenes AI uses natural language understanding. Trained with universal language model which has been trained with huge amount of data. It focuses on what you mean rather what you type.

After when suggestions have been added then select all suggestions and then click on Add to topics.

No alt text provided for this image

After adding to topics. Click on Existing tab and then click on toggle button to enable this Topic for your Bot.

No alt text provided for this image

Now lets quickly test our bot. Click on button at the bottom “Test your Bot”

No alt text provided for this image

It will open a chat. In below snap shot you can see that I just typed word “Key”, Bot itself is asking to confirm whether what I meant by that and giving me two options Yes and NO.

No alt text provided for this image

Upon selecting option -> Yes. You can see in below snapshot, Bot has correctly answered the question by giving answer from the FAQ I provided as topic from MS website.

No alt text provided for this image

You can add more trigger phrases to any topic by clicking on the topic. It will open the window such as shown in snapshot below.

No alt text provided for this image

Now lets create a new bot but this time in Spanish language. Click on bot icon on top right and click on + New bot.

No alt text provided for this image

Select Spanish as language now.

No alt text provided for this image

Now follow the same steps as mentioned above for the bots in English. This time you try the below URL for Spanish language bot.

https://www.microsoft.com/es-mx/software-download/faq

2. Embed this Bot to your HTML or Web page

Now lets embed this bot to our website page. Click on Channels option on left hand side menu. Then select Custom website.

No alt text provided for this image

on the right hand side under Default embed code you will see the HTML code. Copy this and you can just paste it in your HTML or .Aspx page.

No alt text provided for this image

if you already have a HTML/Web page you can just copy and paste below code rather than full HTML.

<iframe src=”https://powerva.microsoft.com/webchat/bots/WhateverGUID” frameborder=”0″ style=”width: 100%; height: 100%;”></iframe>

Below is an example where I created an HTML file and pasted the above code.

No alt text provided for this image
No alt text provided for this image

3. Verify the User Input Data by connecting Chatbot with Power Automate

Now we will see how we can easily perform some actions based on user input data during chat.

In my example

  1. Chatbot will ask user to enter a Mobile number
  2. After providing a mobile number a Power Automate Virtual Agent flow will search that Mobile number in CDS database against account entity
  3. If account is successfully found then It will return output in form of Account Name to the Chatbot
  4. Chat bot will display that account number to user.

Now for first requirement we will have to create a topic or we can modify existing one. I am going to select a topic from the list and click on the circled icon to open the flow for this topic.

No alt text provided for this image

You can see a flow which is created against each topic behind the scenes. We will use the same topic and modify it.

No alt text provided for this image

Click on + icon and add a question.

No alt text provided for this image

Now type an appropriate question such as I am asking customer to enter mobile number. Then select a type to identify the type of input from user. I have selected phone as we are expecting a phone number.

No alt text provided for this image

Now give a name to the variable at the bottom. This variable will save user input and further can be used to perform any actions. In our case we will use this mobile number input to our flow to fetch the account record.

No alt text provided for this image

Now create on + icon below the Question we added then click on Call an action.

No alt text provided for this image

This will open a Power Virtual Agent flow with an Input and Output.

No alt text provided for this image

Click on Add an Input add then on Text

No alt text provided for this image

Give any appropriate name to input. Such as I have given mobile.

No alt text provided for this image

Click on + sign and then search for Variable. Select Initialize a variable. We will use this variable to save the returned value of Account name and will populate the output of this flow for our chatbot.

No alt text provided for this image

Give any appropriate name and select type as string

No alt text provided for this image

Now after creating Variable click on + sign under Variable. We will now use List component to retrieve account record from Power Platform CDS database. You can use any other data source.

No alt text provided for this image

In the list Control first select the Account entity. This entity is automatically created once a CDS database is created in Power Platform environment. I have mentioned above how you can create Power Platform environment and database.

In the filter query we can use Odata query language. I am simply using a filter where I am filtering the telephone field of Account entity and matching it with the input from chatbot i.e. a mobile number entered by user.

telephone1 eq ”

between quotes click then it will open a small window. Under Power Virtual agent select Mobile.

No alt text provided for this image

Also I am setting Top count as 1. Which means only return 1 record at the top of results. I am assuming my mobile number is unique for each account.

No alt text provided for this image

After adding List. click on + icon under it and then add Condition component like you added List before. Click on left text box which will open a small window then put below query under Expression tab.

empty(body(‘List_records’)?[‘value’])

I am checking here if there is a matching record against the provided mobile number.

On the left side text box click and then under Expression tab search for true and select that option.

No alt text provided for this image

In snapshot below you can see condition control has two branches. Based on the result of condition whether its true or false actions of a branch executed. In our scenario if record is not empty then we will perform some action to the Variable we created at the beginning of this flow. I am updating that variable with account name.

Click on + Add an action under the right branch of condition control and then select Control then select Apply to each component.

No alt text provided for this image
No alt text provided for this image
No alt text provided for this image

Click on text field and select Value from list of items

No alt text provided for this image

Then click on Add action item and then search for Set variable. Select the variable we created at the beginning of this flow in the name field and then click on Value and select Account Name from the list records. This will be the account name retrieved set in this variable.

No alt text provided for this image

Now we will set the Out put of our Virtual Agent flow from the internal variable. Click on + icon under condition control and then click on the circled text field then select the Internal variable.

No alt text provided for this image

A complete flow diagram will look like this below.

No alt text provided for this image

After we have created our Flow we will now come back to our chatbox and then resume from where we left. Click on call an Action and then select the flow we just created

No alt text provided for this image

In action then select variable from the above question.

No alt text provided for this image

Then under action click on + icon and add message to display the Out put from the flow. Shown in snapshot below.

No alt text provided for this image

I will chose an account number from CDS. As shown below I will use the circled Mobile number to test my bot.

No alt text provided for this image

Testing:

Now you can see below Bot asks user for a mobile number and after providing the mobile number our background Flow returns the Account name and display in the chatbox window.

No alt text provided for this image

Try it yourself!!