Create a content page for your Microsoft Teams tab

The content page is an HTML page that you host. When the user visits your tab, Microsoft Teams will load the contentUrl (that you provided earlier) within an iframe inside the main tab canvas area.

In this page, you present the main function of your tab, following our design recommendations. You might also need to use the supplied context to help display the correct content.

Note

The very simple "maps" example in this documentation uses existing Bing and Google maps as content pages for illustration, which of course do not include this library. See the samples for a full example tab that does so.

Tab with iframed content highlighted.

Prerequisites for content displayed in your tab

For your content to display within a Microsoft Teams tab, make sure it meets the requirements for tab pages.

In summary: You must host your page on a secure HTTPS endpoint, ensure that your page permits itself to be iframed, include the Microsoft Teams JavaScript client SDK, and call microsoftTeams.initialize().

You can enable team members to create and share links to items within your tab, such as an individual task within a tab that contains a task list. When chosen, the link navigates to your tab, which focuses on the specific item. See Create deep links to learn how.

Samples

Check out our sample tabs on GitHub.