Azure: How do I add a chat bot to Blogger

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.

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 .

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.



You can click on “Edit” or “Get Bot Embed Codes” and Copy the Iframe html code for integrate WebChat Channels 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.



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



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.

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.Enable GingerCannot connect to Ginger Check your internet connection
or reload the browserDisable in this text fieldEditEdit in GingerEdit in Ginger×