By Adnan Khan

Transform Website FAQs into Multi-Language Chatbots,
No Code Needed!

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.
  • Click on basic conventional bot
  • 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.
  • 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.
  • “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

  • After clicking on Add and then start will show you the message as shown in Image below. It will take sometime.
  • 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.
  • After adding to topics. Click on Existing tab and then click on toggle button to enable this Topic for your Bot.
  • Now lets quickly test our bot. Click on button at the bottom “Test your Bot”
  • 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.
  • 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.
  • 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.
  • Now lets create a new bot but this time in Spanish language. Click on bot icon on top right and click on + New bot.
  • Select Spanish as language now.
  • 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.
  • 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.
  • if you already have a HTML/Web page you can just copy and paste below code rather than full HTML.
  • Below is an example where I created an HTML file and pasted the above code.
				
					<iframe src=”https://powerva.microsoft.com/webchat/bots/WhateverGUID” frameborder=”0″ style=”width: 100%; height: 100%;”></iframe>
				
			

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.

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

  • Click on + icon and add a question.
  • 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.
  • 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.
  • Now create on + icon below the Question we added then click on Call an action.
  • This will open a Power Virtual Agent flow with an Input and Output.
  • Click on Add an Input add then on Text
  • Give any appropriate name to input. Such as I have given mobile.
  • 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.
  • Give any appropriate name and select type as string
  • 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.
  • 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.
  • 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.
  • 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.
  • 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.
  • Click on text field and select Value from list of items
  • 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.
  • 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.
  • A complete flow diagram will look like this below.
  • 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
  • In action then select variable from the above question.
  • Then under action click on + icon and add message to display the Out put from the flow. Shown in snapshot below.
  • I will choose an account number from CDS. As shown below I will use the circled Mobile number to test my bot.

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.

Try it yourself!!

Featured Insights

Stay Informed with ITKnocks'
Latest Technical Articles

Let's Shape the Future Together!

Ready to shape the future of your business? Connect with ITKnocks, your catalyst for innovation. Let’s collaborate and transform possibilities into reality. Contact us, and let the possibilities unfold!