We created an IT Help Desk app for our client using Power Platform. As part of it, we made a Copilot agent (a chatbot) that lets users ask questions and get answers right away.
Later, the client requested that we make the chatbot available on a specific website, allowing users to access it easily through a web link and initiate a chat. To achieve this, I created a SharePoint site page and added the chatbot to it.
In this tutorial, I will show you how to publish an Agent to a live or demo website in Copilot Studio.
Additionally, we will address an error (Embedding content from this website isn’t allowed.) that often occurs when embedding the Copilot agent on a live website (SharePoint Site Page).
Publish an Agent to a Live or Demo Website in Copilot Studio
When you publish your agent, you can put it on a prebuilt demo website to easily share with your team and others. Or, you can add it to your website if you want it to be live there.
When should we use our live website and demo website
| Demo Website | Live/Custom Website |
|---|---|
| You should use the demo website to test the Copilot agent and share it with your teammates or others who want to try it out. It’s not meant for real customer use. | For actual production, like helping customers on your support page, you should publish the agent on your live website. |
Publish an Agent to a Live Website in Copilot Studio
Let’s start to publish a Copilot agent to a live SharePoint site page.
- Go to your Agent in the Microsoft Copilot studio. Select Channels.
- Click Web app under Other channels.
- Select Copy to copy the embed code to the clipboard.
Note:
If you can’t see the Embed code section on the web app screen, go to Settings -> Security -> Authentication, and choose ‘No Authentication‘, and click Save.
- Set up and open a SharePoint Site page (Site content -> Site pages) where you want to publish the specific Copilot agent.
- Click on the + icon to add a new web part. Search and select the SharePoint Embed web part.
- Next, when you paste the embed code inside the code box, it will throw an error that says “Embedding content from this website isn’t allowed, but your admin can change this setting. They will need to add ‘copilotstudio.microsoft.com’ to the list of sites that are allowed.“
It clearly states that the embed code from the website is not permitted, which can only be done by the administrative staff. Admin needs to add ‘copilotstudio.microsoft.com‘ in the HTML Field Security.
- To resolve the above error, go to SharePoint Settings (gear icon) -> Site information -> View all site settings.
- In the Site settings window, select HTML Field Security under the Site Collection Administration.
- Under the Allow iframes from this domain, add copilotstudio.microsoft.com in the text box and click on Add and OK.
Now the copilotstudio has been added as shown below. Click OK.
- Return to the SharePoint page and try to add the embed code in the Embed web part again. You’ll see no errors, and the Copilot agent will be visible on the page.
Finally, you or your teammates can begin the conversation with the agent directly from the SharePoint page as follows.
Publish an Agent to a Demo Website in Copilot Studio
The image below represents a Copilot Studio Agent named Tech Support Assistant. This agent will be published to a demo website, allowing other users or teammates to use it for testing purposes.
Follow the instructions below to do so:
- Go to Settings from the top left corner.
- Select Security -> Click Authentication.
- In the Authentication window, select “No authentication“. Click Save.
- From the save configuration box, click Save. After a while, the success saving notification will appear. Exit the window.
- On the Agent window, select the Channels tab -> Click Demo website under the Share a preview section.
- Provide the details below:
- Welcome message: Tell your team members about your agent and what it does.
- Conversation starters: Provide your team members with trigger phrases to initiate a conversation with the agent.
- Share your website: To invite team members to try your agent, copy the provided link to your clipboard.
Click Save.
Finally, the channel will be saved and ready to test.
- Share the copied agent website link with your teammates or other users. When they open the demo website URL, a window will appear showing trigger phrases on the left and the chatbot on the right, allowing them to start a conversation.
- For example, when I said “Good Morning,” it responded by asking if I needed any help. Similarly, when I asked, “What is this bot?” it provided a clear and detailed explanation as shown below.
I hope this article helped you to learn how to embed an agent into your live website (especially in a SharePoint Site Page). Also, we saw how to publish an agent to an inbuilt demo website in Copilot Studio step by step.
Moreover, you may like some more tutorials:
- Create an Agent Flow Using Designer in Copilot Studio
- Add Copilot to Power Apps
- Microsoft Copilot in Power Automate
- Create a Subsite in SharePoint
- 15 SharePoint Document Library Best Practices
- Add a Multistep Form in Power Pages
Hey! I’m Bijay Kumar, founder of SPGuides.com and a Microsoft Business Applications MVP (Power Automate, Power Apps). I launched this site in 2020 because I truly enjoy working with SharePoint, Power Platform, and SharePoint Framework (SPFx), and wanted to share that passion through step-by-step tutorials, guides, and training videos. My mission is to help you learn these technologies so you can utilize SharePoint, enhance productivity, and potentially build business solutions along the way.
