Now you can use ShortPoint to view company teams directly in your SharePoint page.

Short Video
Full Feature Demo

Adding Microsoft Teams to SharePoint and Office 365 is easy and straightforward with ShortPoint. Starting with ShortPoint version 6.7.x.x, you will be able to integrate Microsoft Teams in your SharePoint page to:

  • View your teams;
  • View teams from the entire organization;
  • Open teams in Microsoft Teams Desktop App or in Microsoft Teams Online;
  • Open team's Documents Library;
  • View team members and open member's Delve Profiles;
  • View team channels and tabs and open them in the Microsoft Teams Desktop App;
  • View my tasks and open tasks in Microsoft Planner.

Before You Start

Teams Design Element uses Microsoft Graph to get Teams data from your organization. Prior to adding Teams Design Element into your SharePoint Page, you have to connect ShortPoint to Microsoft Graph:

1. From your Site Contents navigate to ShortPoint Dashboard and click Integrations.  

2. If you didn't connected Microsoft Graph before, click connect and logging with you Office 365 Tenant Administrator account.

3. If the login was successful, you have to grant ShortPoint the list of permissions that appears by clicking Accept.

Note: If you already Connected Microsoft Graph before ShortPoint version 6.7.x.x, you have to click Reconnect in order to be able to integrate Teams Design Element into your SharePoint pages. Follow this article to find out more.

ShortPoint Teams Integration Supports:

  • SharePoint Online (Office 365)
  • SharePoint 2019 On-Premise (limited functionality)

The following points will describe the full functionality of Teams Design Element for SharePoint Online (Office 365).

How to Add Teams to SharePoint Online using ShortPoint

Teams Design Element can be easily added to your SharePoint pages using ShortPoint Page Builder:

Basic Settings

Configure your Teams Design Element as you wish. You can control privacy settings, show or hide the icons, modify the size of the element, completed tasks, expand tabs etc.:

Filter Teams

In Teams Design Element you can choose to display My Teams or All Teams from the organization.  By default, My Teams will be selected, meaning that the Teams Design Element will only display teams where the current user is member of.

However, if you choose All Teams from organization, users will see all the teams grouped in two sections:

teams I'm member of on the top and teams I'm not member of at the bottom:

Show Teams Icon

This option is by default enabled and it will generate dynamic icons for each team using the first letter of each team's name.

Expand tabs

Enabling this option will allow users to expand and see the tabs from each team channel: as well as to navigate to the channel tabs directly in the Microsoft Teams Desktop App:

And to navigate to the channel tabs directly in the Microsoft Teams Desktop App:

Show Completed Tasks

By default this option is disabled meaning that the users will be able to see only the active tasks (not completed). By enabling this option, users will be able to see all their tasks including the completed ones.


Set the appropriate height for your Teams Design Element in order to align it with the other elements in the page.

Advanced Settings

Add some extra styling to your Teams Design Element:

Team Hover Color

You can chose the team item background color when the mouse is over it:

Search Box Label

Set a custom label for your Teams Search Box. By default the search box label is "Search Teams...".

Heading and Sub Heading Styles

These settings will be applied on the header container of the teams detailed view. The teams detailed view will appear after you click on a specific team.

You can set a custom color for your header background and also set colors and font weight for your headers.

Related articles: