Articles → MICROSOFT AZURE → Integrate Azure Bot On The Web Page

Integrate Azure Bot On The Web Page






Steps




  1. Click on the Channels option within the Bot Management
    2. Picture showing the Channels submenu in the Bot Management menu
    Click to Enlarge

  2. A page will appear where you can select different channels like the web page, Facebook, etc.
  3. Click on the link Get bot embed codes
    4. Picture showing the Get bot embed codes link in the connect to channels screen
    Click to Enlarge

  4. A popup window will appear. In the popup window, click on the link Click here to open the Web Chat configuration page
    5. Picture showing the Click here to open the Web Chat configuration page link
    Click to Enlarge

  5. A page will appear, where you can see the secret key and iFrame embedded code
    6. Picture showing the secret key and html embed code for chat bot
    Click to Enlarge

  6. In the IFrame code, replace the placeholder YOUR_SECRET_HERE with the actual secret key
  7. Finally, add the iFrame code to the HTML page
    8. <html>
	<body>
		<iframe src='https://webchat.botframework.com/embed/KG777?s=iSRt_dyQZy4.pdMvSZYWuwW5GSXjRlnHDcl3BX9hQIv_uvp9gKJX610' style='min-width: 400px; width: 100%; min-height: 500px;'></iframe>
	</body>
</html>



    Output


    Picture showing the output of integrating chat bot on the HTML page
    Click to Enlarge



Posted By  -  Karan Gupta
 
Posted On  -  Tuesday, November 3, 2020

Query/Feedback


Your Email Id
 
Subject
 
Query/FeedbackCharacters remaining 250