The Bot Application runs inside Skype, web chat, Facebook, Message, etc. Users can interact with bots by sending them messages, commands, and inline requests. You control your bots using HTTPS requests to the bot API. Azure bot Application service automatically configures the Web Chat channel while publishing to Azure. Bot channel includes the Web Chat Channel which can be embedded directly onto websites or bloggers for users to interact.

In this article, we will learn how to integrate our bot application right into your blogger via the Microsoft Bot Web Chat Channel.

How do I add a chat bot to Blogger

Create FAQ Bot Application:

You can refer to my previous article for creating and building a Xamarin FAQ Bot using Azure Bot Service and deploy it into Azure. I am not using any coding for developing Bot Application, you can follow the article provided steps for creating and deploying FAQ Bot .

How do I add a chat bot to Blogger

Generate WebChat Channel Html Code


Login to Azure portal > Select the “All Resources” >Select Your Web App Bot > Select Channels, As already discussed automatically configured the Web Chat channel while publishing to Azure.

How do I add a chat bot to Blogger

You can click on “Edit” or “Get Bot Embed Codes” and Copy the Iframe html code for integrate WebChat Channels to blogger.

How do I add a chat bot to Blogger

Integrate Bot Application into Blogger


Step 1: Sign in to your Blogger(https://www.blogger.com) account. Blogger opens on the default Dashboard page that displays a list of all your hosted blogs.

Step 2: Select your Blogger > Select the layout > Click on Add a Gadget > Add Html and JavaScript Layout component for adding webchat embed code.

How do I add a chat bot to Blogger

Step3: Paste the iFrame HTML code that you copied from the azure portal into the input box and provide the title of the Bot.

How do I add a chat bot to Blogger

Click on preview and verify width and Height is aligned with your blogger layout.

Step 4: Click "Save arrangement “above the layout editor to publish the post containing the Web Chat App to your blog.

Test Web Chat Application

You can click on “View Blog” for view the original layout design and test your Bot Application.


How do I add a chat bot to Blogger

Summary

In this article, you learned how to integrate bot applications right into your blogger via the Microsoft Bot Framework Web Chat Channel. If you have any questions/ feedback/ issues, please write in the comment box.
Power Virtual Agents are an easily created powerful bot and no-code graphical interface without the need for data scientists or developers. It eliminates the gap between the subject matter experts and the development teams building the bots and it minimizes the IT effort required to deploy and maintain a custom conversational solution. In my previous article you learned how to set up and quick overview about power virtual agents.

In this article you will learn more about how you can customize the bot conversation messages. User conversation message called as “Topic” in Power virtual agents. A topic has trigger phrases - these are phrases, keywords, or questions that a user is likely to type that is related to a specific issue - and conversation nodes - these are what you use to define how a bot should respond and what it should do and you can maintain up to 1000 topics in a Bot.

In this article you will learn more about how you can customize the bot conversation messages. User conversation message called as “Topic” in Power virtual agents. A topic has trigger phrases - these are phrases, keywords, or questions that a user is likely to type that is related to a specific issue - and conversation nodes - these are what you use to define how a bot should respond and what it should do and you can maintain up to 1000 topics in a Bot.






User and System Topic

Once again remind you, before reading this article, You can follow my previous article to learn more about setup and create the first Power Virtual agent Bot application. 

When you have successfully create bot applications, you are able to see a number of topics will be created automatically and also you can see how the bot conversation works in practice by testing it in the Test bot pane. For example, a user might type “I want a Business Laptop" into your bot. The AI will recommend the Business Laptop and request you to confirm adding to the cart. Bot will suggest you provide “Yes” or “No”.

Power Virtual Agents: customize the bot conversation messages

There are two topics the category system will generate. You can refer and learn the topic, how you need to implement it for your business use case.

User Topics Category you will find Four pre-populated User Topics that are titled as lessons. These lesson topics can be used to help understand, simple to complex ways of using nodes to create bot conversations.

System Topics is reusable topics like greeting, Say goodbye like that. These are pre-populated topics that you are likely to need during a bot conversation.

Create New Topic


You can create your own topic and maintain up to 1000 topics in a Bot.

Step 1: Go to the Topics tab on the side navigation pane to open the topics page.

Step 2: on the Topic page, Select the New Topic option on the top navigation pane.

Power Virtual Agents: customize the bot conversation messages

Step 3: Provide a topic name, description, and one or more trigger phrases for the topic by clicking on Add button.

Power Virtual Agents: customize the bot conversation messages

Go to Authoring Canvas

Click on Save Topic options on the right corner on the Topics page. Once click on Save topic, you will get the error and asking you to set Authoring Canvas

Power Virtual Agents: customize the bot conversation messages

Power Virtual Agents open the topic in the authoring canvas and displays the topic's trigger phrases. The authoring canvas is where you define the conversation path between a customer and the bot, message Edit text box having styling feature, add and change the text font style and hyperlink

Power Virtual Agents: customize the bot conversation messages

Build and Save Topic


Once you have done the changes, Click on Topic Checker. Topic checker will show you if there are any errors or warnings in the topic. If there's no error, Click on Save options.

Power Virtual Agents: customize the bot conversation messages

Test Bot Application

You're now ready to test your bot. You will test your bot using the built-in Power virtual agent bot Emulator. You can provide user input, which we created a topic say “Can you suggest a Microsoft AI Learning Blog” and Bot will reply to the triggered message.

Power Virtual Agents: customize the bot conversation messages


Summary


Power Virtual Agents: customize the bot conversation messages

You have successfully created topics and run the application in the power virtual agent. I hope you have enjoyed learning about the Power virtual agent bot. If you have any questions/feedback/issues, please write them in the comment box.


Power Virtual Agents is an easy to create, powerful bot with a no-code graphical interface. This means there isn't necessarily a need for data scientists or developers. It eliminates the gap between the subject matter experts and the development teams building the bots and it minimizes the IT effort required to deploy and maintain a custom conversational solution.

Building a FAQ bot using Power Virtual Agents

Every Business has their own website with a FAQ page, so you can use support questions from your existing web pages when you are creating a Power virtual agent bot, it will help you to create your support Bot within 5 min. You don’t want to copy and paste or manually re-creating same content. You can use AI agents assisted authority to automatically extract and create a relevant suggested topic from your FAQ pages. Microsoft made this sequence of work as a very simple easy steps, you can follow the steps below and create your own FAQ business chat Bot.

Building a FAQ bot using Power Virtual Agents

Setup Power Virtual Agents

Power Virtual Agents is a software-as-a-service (SaaS). It allows you to easily sign up, create your bot, and embed it into your website and integrate it to the different channels with just a few clicks. There’s no infrastructure to maintain or complex systems to deploy. Provide your work school account email id and click on Sign up /Sign in.

Building a FAQ bot using Power Virtual Agents

After click on Sign up/ sign in, you will get the following screen asking you to set your Bot name. Provide the relevant your business bot name.

Building a FAQ bot using Power Virtual Agents

You need to make sure there are three main steps need to do while doing import FAQ and add the topic to your bot application.
  • Import Suggested Topics from FAQ webpage
  • Add a topic.
  • Enable the topics

Import FAQ content

You can follow below steps for import topic messages from your FAQ web page

Step 1: Go to the Topics tab on the side navigation pane to open the topics page.

Step 2: on the Topic page, Select the Suggested Topics option on the top navigation pane/ suggested tab button.


Building a FAQ bot using Power Virtual Agents

Extract FAQ Topics

You are not imported any suggestions topic before, the list of suggested topics will be blank. A link to Get started or Learn more appears instead.

Building a FAQ bot using Power Virtual Agents


  • The following screen will appear after clicking on “Get Started”.
  • You can add multiple webpages at the same time, but Microsoft recommends that you include only a few at a time to keep the list of suggestions manageable.
  • You can make sure your webpage should be secure with SSL (https://)
  • If you added a page by mistake, you could select the Delete option before click on start.

Building a FAQ bot using Power Virtual Agents

When you're done adding pages, select Start. The process can take several minutes, depending on the complexity and number of webpages you added. The message "Getting your suggestions. This may take several minutes" appears at the top of the screen while the extraction is in progress.

Building a FAQ bot using Power Virtual Agents

After you've successfully extracted content, a number of suggestions will appear. Here, we have added MVP Summit FAQ URL, it’s extracted all the FAQ around 48 FAQ extracted and displaying in the suggested topic, you can now review these suggestions to see what you need add to your bot



After adding, you need to do two more steps to complete the process but if you try to test the application, after the suggested topic, you wont get those topic questions from the suggestion, Bot will reply the message “ Sorry I am not able to find a related topic“ .

Building a FAQ bot using Power Virtual Agents


Add a Topics

The import process has been completed, the topic suggestions appear on the Suggested tab. You can just add suggestions without reviewing but best approach was review them individually like below to decide which ones you want to include in your bot.

Step 1: Select the Name of Suggestions from Suggestion tab.

Step 2: You can also add or delete multiple topic suggestions at a time. If you select multiple rows from the suggestions tab, you'll see options to Add to topic or Delete.

Step 3: Let Start review the suggestion and every topic end of the conversion will display Survey topic questions like “ Did that answered the question” and the user can reply message “ Yes “ or “No” based on that conversation will continue, if you don’t want to display the conversation survey, you can remove anytime .

Step 4: You can edit Trigger phases, which users ask questions and edit answered messages, which bot will reply to the user.

Step 5: You can press on “Add to the Topic”, after your review suggestion topic

Step 6: Suggestion topic is not relevant or duplicate, you can press delete suggestion for remove the topic.

Building a FAQ bot using Power Virtual Agents

Once you click on Add to topic, you will get a confirmation message saying, your FAQ topic was added to existing topics.

Building a FAQ bot using Power Virtual Agents

Enable the topics

Suggested topics are added to the Existing tab with their status set to Off. This way, topics won't be prematurely added to your bot, so you can follow the below steps to enable the topic.

Step 1: Select Topics on the side navigation pane.

Step 2: Go to the Existing tab.

Step 3: For each topic you want to enable, turn on the toggle under Status.

Building a FAQ bot using Power Virtual Agents

Test Your Bot Application

You're now ready to test your bot. You will test your bot using the built-in Power virtual agent bot Emulator. Start giving the user Input, which you reviewed and enabled topic and refer below image, how to Trigger phase and message sync with user reply.


Summary

Building a FAQ bot using Power Virtual Agents

You have successfully done the import FAQ page in the power virtual agent. I hope you have enjoyed learning about Power virtual agent bot. you can also read my previous power virtual agent articles.
  1. Build a Microsoft Bot Application With Power Virtual Agents
  2. Customize the Bot Conversation Message With Power Virtual Agent
If you have any questions/feedback/issues, please write them in the comment box.
Power Virtual Agents are an easily created powerful bot and no-code graphical interface without the need for data scientists or developers. It eliminates the gap between the subject matter experts and the development teams building the bots and it minimizes the IT effort required to deploy and maintain a custom conversational solution. In my previous article you learned how to set up and quick overview about power virtual agents.

In this article you will learn more about how you can customize the bot conversation messages. User conversation message called as “Topic” in Power virtual agents. A topic has trigger phrases - these are phrases, keywords, or questions that a user is likely to type that is related to a specific issue - and conversation nodes - these are what you use to define how a bot should respond and what it should do and you can maintain up to 1000 topics in a Bot.


User and System Topic

Once again remind you, before reading this article, You can follow my previous article to learn more about setup and create the first Power Virtual agent Bot application.

When you have successfully create bot applications, you are able to see a number of topics will be created automatically and also you can see how the bot conversation works in practice by testing it in the Test bot pane. For example, a user might type “I want a Business Laptop" into your bot. The AI will recommend the Business Laptop and request you to confirm adding to the cart. Bot will suggest you provide “Yes” or “No”.



There are two topics the category system will generate. You can refer and learn the topic, how you need to implement it for your business use case.

User Topics Category you will find Four pre-populated User Topics that are titled as lessons. These lesson topics can be used to help understand, simple to complex ways of using nodes to create bot conversations.

System Topics is reusable topics like greeting, Say goodbye like that. These are pre-populated topics that you are likely to need during a bot conversation.

Create New Topic

You can create your own topic and maintain up to 1000 topics in a Bot.

Step 1: Go to the Topics tab on the side navigation pane to open the topics page.

Step 2: on the Topic page, Select the New Topic option on the top navigation pane.



Step 3: Provide a topic name, description, and one or more trigger phrases for the topic by clicking on Add button.


Go to Authoring Canvas

Click on Save Topic options on the right corner on the Topics page. Once click on Save topic, you will get the error and asking you to set Authoring Canvas



Power Virtual Agents open the topic in the authoring canvas and displays the topic's trigger phrases. The authoring canvas is where you define the conversation path between a customer and the bot, message Edit text box having styling feature, add and change the text font style and hyperlink


Build and Save Topic

Once you have done the changes, Click on Topic Checker. Topic checker will show you if there are any errors or warnings in the topic. If there's no error, Click on Save options.


Test Bot Application

You're now ready to test your bot. You will test your bot using the built-in Power virtual agent bot Emulator. You can provide user input, which we created a topic say “Can you suggest a Microsoft AI Learning Blog” and Bot will reply to the triggered message.


Summary


You have successfully created topics and run the application in the power virtual agent. I hope you have enjoyed learning about the Power virtual agent bot. If you have any questions/feedback/issues, please write them in the comment box.

Power Virtual Agents is an easily created powerful bot and no-code graphical interface without the need for data scientists or developers. It eliminates the gap between the subject matter experts and the development teams building the bots and it minimizes the IT effort required to deploy and maintain a custom conversational solution.

This article will demonstrate how easy it is to setup and build a Bot using Power Virtual Agents. The Bot will call a Power Automate Flow to return data from CDS and display it to the user. Power Virtual Agents is part of Microsoft AI and it allows Bots to be created using a Flow like designer without any code

Power Virtual Agents: Build a Microsoft Bot Application

Setup Power Virtual Agents Power Virtual Agents is a software-as-a-service (SaaS). It allows you to easily sign up, create your bot, and embed it into your website and integrate to the different channels with just a few clicks. There’s no infrastructure to maintain or complex systems to deploy.

1. Navigate to Power Virtual Agents and select Start Free and Sign in/ Signup using your work school account.

Power Virtual Agents: Build a Microsoft Bot Application

Create New Bot Application You can create a new bot by selecting the icon on the title bar to open the Bots pane and then selecting New bot, let you select the default environment for now.

Power Virtual Agents: Build a Microsoft Bot Application

Customize your Greeting The Power virtual agent dashboard with sequence steps is the author topic , publish bot and Monitor the performance. You can click on customize your greeting and will see the details below

Power Virtual Agents: Build a Microsoft Bot Application

Select the options “Customize your greeting” and you can see the default user trigger options and message template. Initial trigger phase will be, which user provides the trigger message and based on that bot will reply the message.

Power Virtual Agents: Build a Microsoft Bot Application

Test Your Bot Application You're now ready to test your bot. You will test your bot using the built-in Power virtual agent bot Emulator. Start give the user Input and also refer below image, how to Trigger phase and message sync with user replay


Power Virtual Agents: Build a Microsoft Bot ApplicationPower Virtual Agents: Build a Microsoft Bot Application
Summary 

You have successfully done the setup and built a bot application in the power virtual agent. I hope you have enjoyed learning about the Power virtual agent bot. If you have any questions/feedback/issues, please write them in the comment box.
The Azure AD is the identity provider, responsible for verifying the identity of users and applications and providing security tokens upon successful authentication of those users and applications.in this article I have explained about create Azure AD authentication and integrate into bot application using AuthBot library.



The Bot show very simple dialog with openUrl button and this button launches the web browser for validate user credential and AD will response the message with authentication code, you can copy same code and reply back to the bot, bot will validation and response the welcome message.

You can follow below given steps one by one and you will get to see an interesting demo at end of article.

Azure AD App registration:

I will show the steps given below for the azure application creation, user creation and permission configuration. While implementing bot application, We need Client ID, tenant, return URL, so here I will show how to get all the configuration information from the steps given below.

Step 1: 

Login to Microsoft Azure portal and choose Azure Active Directory from the sidebar.

Step 2:

 If you have not created AZURE Active directory, try to create new AD creation for tenant url or Select or add tenant url from Domain names sections

Building Bot Application with Azure AD Login Authentication using AuthBot

Step 3: 

Select Application Registration and Provide the details given below, name for the application , application type must be Web app/API, enter your application redirect URL and click on Create.

Building Bot Application with Azure AD Login Authentication using AuthBot

Step 4: 

We need to give the permission to access the application from Bot, so grand the permission. Select newly created Application > select Required Permission > Click Grand permission.

Step 5: 

create new user from users and groups sections (optional)

Step 6:

 Create client secret key from Application. Select Application > Select keys > add new / copy client secret key .

Building Bot Application with Azure AD Login Authentication using AuthBot

Step 4: 

You can copy tenant, client ID and Client Secret and you can follow below steps for create and implement AD authentication in Bot

Create New Bot Application:

Let's create a new bot application using Visual Studio 2017. Open Visual Studio > Select File > Create New Project (Ctrl + Shift +N) > Select Bot application.

Building Bot Application with Azure AD Login Authentication using AuthBot


The Bot application template gets created with all the components and all required NuGet references installed in the solutions.

Building Bot Application with Azure AD Login Authentication using AuthBot

Install AuthBot Nuget Package:

The AuthBot provide Azure Active Directory authentication library for implement Azure AD login in Bot .

Right click on Solution, select Manage NuGet Package for Solution > Search “ AuthBot” > select Project and install the package.

Building Bot Application with Azure AD Login Authentication using AuthBot

You can follow given below steps for integrate AD authentication 

Step 1:

 Select Web.config file and add Mode,resourceID,Endpointurl ,Tenant,clientID,clientSecret and redirect url appsettings property and replace Azure AD details as per below
<appSettings>
<add key="BotId" value="YourBotId" />
<add key="MicrosoftAppId" value="" />
<add key="MicrosoftAppPassword" value="" />
<add key="ActiveDirectory.Mode" value="v1" />
<add key="ActiveDirectory.ResourceId" value="https://graph.windows.net/" />
<add key="ActiveDirectory.EndpointUrl" value="https://login.microsoftonline.com" />
<add key="ActiveDirectory.Tenant" value="dxdemos.net" />
<add key="ActiveDirectory.ClientId" value="2d3b5788-05a5-486d-b2a4-2772a4511396" />
<add key="ActiveDirectory.ClientSecret" value="wU3oFBJ1gjWcB8Lo/fMaaCwg7ygg8Y9zBJlUq+0yBN0=" />
<add key="ActiveDirectory.RedirectUrl" value="http://localhost:3979/api/OAuthCallback" />
</appSettings>

Step 2: 

Select Global.asax.cs file and call all the bot app setting property and assign to AuthBot model class, like below
using System.Configuration;
using System.Web.Http;
namespace DevAuthBot
{
public class WebApiApplication : System.Web.HttpApplication
{
protected void Application_Start()
{
GlobalConfiguration.Configure(WebApiConfig.Register);
AuthBot.Models.AuthSettings.Mode = ConfigurationManager.AppSettings["ActiveDirectory.Mode"];
AuthBot.Models.AuthSettings.EndpointUrl = ConfigurationManager.AppSettings["ActiveDirectory.EndpointUrl"];
AuthBot.Models.AuthSettings.Tenant = ConfigurationManager.AppSettings["ActiveDirectory.Tenant"];
AuthBot.Models.AuthSettings.RedirectUrl = ConfigurationManager.AppSettings["ActiveDirectory.RedirectUrl"];
AuthBot.Models.AuthSettings.ClientId = ConfigurationManager.AppSettings["ActiveDirectory.ClientId"];
AuthBot.Models.AuthSettings.ClientSecret = ConfigurationManager.AppSettings["ActiveDirectory.ClientSecret"];
}
}
}

Step 3: 

You can create a new AzureADDialog class to show the default login and logout UI Design dialog. Rightclick on Project, select Add New Item, create a class that is marked with the [Serializable] attribute (so the dialog can be serialized to state), and implement the IDialog interface.
using AuthBot;
using AuthBot.Dialogs;
using Microsoft.Bot.Builder.Dialogs;
using Microsoft.Bot.Connector;
using System;
using System.Configuration;
using System.Threading;
using System.Threading.Tasks;
namespace DevAuthBot.Dialogs
{
[Serializable]
public class AzureADDialog : IDialog<string>
{

Step 4 :

IDialog interface has only StartAsync() method. StartAsync() is called when the dialog becomes active. The method passes the IDialogContext object, used to manage the conversation.
public async Task StartAsync(IDialogContext context)
{

context.Wait(MessageReceivedAsync);

}

Step 5: 

Create a MessageReceivedAsync method and write the following code for the login and logout default dialog and create a ResumeAfterAuth for after the user login, bot will reply the user name and email id details.
///
/// Login and Logout
///
/// context">
/// item">
///
public virtual async Task MessageReceivedAsync(IDialogContext context, IAwaitable<IMessageActivity> item)
{
var message = await item;
//endpoint v1
if (string.IsNullOrEmpty(await context.GetAccessToken(ConfigurationManager.AppSettings["ActiveDirectory.ResourceId"])))
{
//Navigate to website for Login
await context.Forward(new AzureAuthDialog(ConfigurationManager.AppSettings["ActiveDirectory.ResourceId"]), this.ResumeAfterAuth, message, CancellationToken.None);
else
{
//Logout
await context.Logout();
context.Wait(MessageReceivedAsync);
}
}
///
/// ResumeAfterAuth
///
/// context">
/// result">
///
private async Task ResumeAfterAuth(IDialogContext context, IAwaitable<string> result)
{
//AD resposnse message
var message = await result;
await context.PostAsync(message);
context.Wait(MessageReceivedAsync);
}

After the user enters the first message, our bot will reply and ask to login to the AD. Then, it waits for Authentication code and bot will reply the user details as a response like below.

Building Bot Application with Azure AD Login Authentication using AuthBot

Run Bot Application

The emulator is a desktop application that lets us test and debug our bot on localhost. Now, you can click on "Run the application" in Visual studio and execute in the browser


Building Bot Application with Azure AD Login Authentication using AuthBot
  • Test Application on Bot Emulator
  • You can follow the below steps to test your bot application.
  • Open Bot Emulator.
  • Copy the above localhost url and paste it in emulator e.g. - http://localHost:3979
  • You can append the /api/messages in the above url; e.g. - http://localHost:3979/api/messages.
  • You won't need to specify Microsoft App ID and Microsoft App Password for localhost testing, so click on "Connect".
Building Bot Application with Azure AD Login Authentication using AuthBot

Related Article:

I have explained about Bot framework Installation, deployment and implementation in the below article

Summary

In this article, you learned how to create a Bot Azure AD login authentication and Logout using AuthBot. If you have any questions/feedback/ issues, please write in the comment box.



Featured Post

Improving C# Performance by Using AsSpan and Avoiding Substring

During development and everyday use, Substring is often the go-to choice for string manipulation. However, there are cases where Substring c...

MSDEVBUILD - English Channel

MSDEVBUILD - Tamil Channel

Popular Posts