Embed Microsoft Teams in SharePoint

In this article we're going to show you how you can embed Live Chat for Microsoft Teams in a SharePoint Modern Communication site.  By default SharePoint doesn't allow you to add a code snippet to your modern communication website and disables scripting in general.  We'll show you how to extend your SharePoint communication site to allow inline javascript code snippets so that you can embed your Microsoft Teams Live Chat into SharePoint.

First, you can use the SharePoint Framework (SPfx) to extend your SharePoint pages with a Modern Script Editor web part.  This web part enables embedding of a JavaScript code snippet into your pages.  We aren't going to cover this step here, but there is a good guide on GitHub:   https://pnp.github.io/sp-dev-fx-webparts/gettingstarted/

Once you have cloned and packaged the Script Editor web part using Node package manager, you can deploy the script editor to your SharePoint site with the app catalog.

SharePoint Script Editor web part

Now, click the 'Edit markup' button to customize your web part.

SharePoint Modern Script Editor

Finally, include your Live Chat for Microsoft Teams code snippet.  If you haven't yet signed up for a Live Chat for Microsoft Teams free trial, you can set it up here.  Once you've added the code snippet to your web part, you see the live chat icon available on your SharePoint communication site.  Now when you start a chat, the chat request is sent directly to your Teams Channel and you can chat with your website visitors right from Microsoft Teams!