Note
Access to this page requires authorization. You can try signing in or changing directories.
Access to this page requires authorization. You can try changing directories.
Tabs are client-aware webpages embedded in Microsoft Teams, Outlook, and Microsoft 365. They're simple HTML tags that point to domains declared in the app manifest and can be added as part of a channel inside a team, group chat, or personal app for an individual user. You can include custom tabs with your app to embed your own web content in Teams or add Teams-specific functionality to your web content. For more information, see Teams JavaScript client library.
Important
- Custom tabs are available in Government Community Cloud (GCC), GCC High, Department of Defense (DoD), and Teams operated by 21Vianet.
There are two types of tabs, static and configurable tabs. These tabs can be utilized in three distinct scopes: personal, groupchat, and teams. Personal (static) tabs, along with personal-scoped bots, are part of the personal apps that are scoped to a single user and pinned to the left navigation bar for easy access. Personal (static) tabs in personal scope continue to work the same way. However, you can now extend static tabs to group chats, channels, or meetings with a customizable experience.
Tabs in chats, channels, or meetings behave more like apps, as you can pin only one tab per app. For example, you can only pin a single YouTube app tab in a meeting. Static tabs in meetings can also be prepinned in meetings by IT Admins.
The following images show tabs added to different contexts in Teams:
Following are a few benefits of static tabs in chats, channels, and meetings:
Pinnable and instant: You can pin apps with static tabs from the add a tab + icon in chats, channels, and meetings. These tabs can be unpinned and don't have the mandatory configuration dialog, which allows you to create tabs that function more like apps.
Unified: You can create one static tab that work in personal and group scopes such as chat, channel, and meeting tabs.
Optional configuration: You can change the default URL in your tab instance by changing the
contentUrlproperty of your app after it's pinned in Teams.
Channel or group tabs also known as configurable tabs, deliver content to channels and group chats and is a way to create collaborative spaces around dedicated web-based content.
The following table helps you determine the best fit for your app:
| Personal | Channels | Group chat | Meetings | Calling | |
|---|---|---|---|---|---|
| Static tabs | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
| Configurable tabs | ❌ | ✔️ | ✔️ | ✔️ | ❌ |
Note
If you have both configurable tab and static tab defined in your app manifest for a specific scope, Teams pins the static tab by default.
You can create a content page as part of a personal static tab, channel or group tab, or dialog (referred as task module in TeamsJS v1.x). You can create a configuration page that enables users to configure Microsoft Teams app and use it to configure a personal, channel, or group chat tab, a messaging extension, or a connector card for Microsoft 365 Groups. You can permit users to reconfigure your tab after installation and create a tab removal page for your application. When you build a Teams app that includes a tab, you must test how your tab functions on both the Android and iOS Teams clients. Your tab must get context through basic information, locale and theme information, and entityId or subEntityId that identifies what is in the tab.
Note
Posts and Files can't be moved from their positions.
Tab features
The tab features are as follows:
- If a tab is added to an app that also has a bot, the bot is also added to the team.
- Awareness of Microsoft Entra ID of the current user.
- Locale awareness for the user to indicate language that is
en-us. - Single sign-on (SSO) capability, if supported.
- Ability to use bots or app notifications to deep link to the tab or to a subentity within the service, for example an individual work item.
- The ability to open a modal dialog from links within a tab.
- Reuse of SharePoint web parts within the tab.
Tabs user scenarios
Scenario: Bring an existing web-based resource inside Teams.
Example: You create a static tab in your Teams app that presents an informational corporate website to users.
Scenario: Add support pages to a Teams bot or messaging extension.
Example: You create static tabs that provide about and help webpage content to users.
Scenario: Provide access to items that your users interact with regularly for cooperative dialogue and collaboration.
Example: You create a channel or group tab with deep linking to individual items.
Declare custom tab in app manifest
A custom tab is declared in the app manifest of your app package. For each webpage you want included as a tab in your app, you define a URL and a scope. Additionally, add the Teams JavaScript client library to your page, and call microsoftTeams.app.initialize() after your page loads. This informs Teams that your app has loaded.
Whether you choose to expose your tab within the channel or group, or personal scope, you must present an