How to Display Messages from a Specific Teams Channel in Your SharePoint Site

Want to show messages from a specific Teams channel? You’ve come to the right place! You can easily do so with the Microsoft Graph API connection. Simply use the "Messages in a channel" use case, and you're all set. Just follow the steps in this article to learn how.

TABLE OF CONTENTS

• Prerequisites
• What is the “Messages in a Channel” Use Case?
• Step-by-step Tutorial
  • Step 1: Edit the ShortPoint Web Part
  • Step 2: Switch to Grid Mode
  • Step 3: Edit the Design Element
  • Step 4: Connect to Microsoft Graph API
  • Step 5: Use the Messages in a Channel Use Case
  • Step 6: Get the Team ID
  • Step 7: Get Channel ID
  • Step 8: Connect
  • Step 9: Map Items
  • Step 10: Save

Prerequisites

• You must have ShortPoint SPFx version 8.6.0.0 and up installed on your SharePoint environment.
• You must be a ShortPoint Designer with an active license.
• You must have the Microsoft Graph API connection enabled. Go to How to Enable Microsoft Graph Integration for MS Graph API Connections to learn how.
• You must authorize the necessary permissions (ChannelMessage.Read.All and Group.Read.All) in the API access page. To check, go to your SharePoint Admin Center > Advanced > API access.
• You must have the Design Element you want to use to connect on your SharePoint page. For best results, we recommend using Design Elements that allow listing of multiple items (e.g. Icon List, Image List, Simple List, etc.).

What is the “Messages in a Channel” Use Case?

The Messages in a Channel use case is a Microsoft Graph API GET query that allows SharePoint users to retrieve a collection of messages (without the replies) from a specific Microsoft Teams channel.

The typical structure of this use case is:

https://graph.microsoft.com/v1.0/teams/#teamId/channels/#channelId/messages

Where you will need to get the following IDs:

• #teamId - is the unique ID of the team where the channel you want to use is located. 
• #channelId - is the unique ID of the channel within that team.

Once you connect using “Messages in a channel”, you will be able to display all those Teams conversations right on your SharePoint sites, giving your page viewers easy access to important company messages.

To use it, you must enable the following permissions in the SharePoint Admin Center:

• ChannelMessage.Read.All - this permission allows the app to read a specific Teams channel's messages on your behalf.
• Group.Read.All - this permission allows the app to list groups, group memberships, and properties. It also permits reading of calendars, conversations, files, and other group content for all the groups you can access.

NOTEIf you haven’t given access to the permissions above, go to your SharePoint Admin Center > Advanced > API access.

Step-by-step Tutorial

Now that you have an idea what the Messages in a channel use case is, let’s walk you through how to use it:

Step 1: Edit the ShortPoint Web Part

Go to the SharePoint page you want to use and click Edit:

Close the Toolbox:

Select the ShortPoint web part and click the Edit Properties icon:

Step 2: Switch to Grid Mode

NOTEShortPoint Connect is currently only available in Grid Mode.

Click the Switch to Grid Mode icon:

Step 3: Edit the Design Element

NOTEYou can use any Design Element you want. For best results, we recommend using Design Elements that allow listing of multiple items (e.g. Icon List, Image List, Simple List, etc.). For this guide, we’ll use Icon List.

Click the cogwheel icon of the Design Element you’ll use:

Step 4: Connect to Microsoft Graph API

Go to the Connect tab:

Select Microsoft Graph API:

NOTEYou need to enable the Microsoft Graph API connection before using it. Learn more about it in How to Enable Microsoft Graph Integration for MS Graph API Connections.

Step 5: Use the Messages in a Channel Use Case

Search for Messages in a Channel and select it:

Step 6: Get the Team ID

You will be prompted to fill in the details under Query Parameters.  Let’s get the Team ID first. To do this, click Get Parameter:

Look for the Teams you want to use and copy its ID:

Click Go back:

Paste the copied ID in the field provided:

NOTETake note of the Team ID. You will still need it for Step 7.

Step 7: Get Channel ID

Now, let’s get the Channel ID. Click Get Parameter:

[1] Paste the Team ID in the field provided and click [2] Run Query:

Look for the channel you want to use and copy its ID:

Click Go back:

Paste the copied Channel ID in the field provided:

Step 8: Connect

Click Run Query:

Select Connect:

Step 9: Map Items

Go to the Items tab:

Delete default content:

Use the link icon to map the properties you want to be displayed:

You can map any property you want. In our case, we used the following properties:

1. #subject in the Title field - shows the subject of the conversation as the titles.
2. #from_user_displayName in the Subtitle field - shows the name of the people who sent the message as the subtitle.
3. #body_content in the Description field - shows the content of the message as the description.
4. #webUrl - links to the actual message in Teams.

(Optional) If you’re using the Icon List, choose an icon to showcase:

NOTECheck out ShortPoint Connect: Basic Tutorial to learn more about mapping properties.

Step 10: Save

Click Preview to see how the Design Element will look:

Click Update to apply your changes:

Select the eye icon to see your page in real time:

Once satisfied, click Save:

Congratulations! You can now showcase your Teams messages on your SharePoint page.

TIPHave lots of messages? Help your viewers easily find the conversation they’re looking for with the Search & Filter Toolbar! Simply go to Getting Started: The Basics of the Search & Filter Toolbar to give it a try. 

Related articles:

• How to Enable Microsoft Graph Integration for MS Graph API Connections
• Connection Type: Microsoft Graph API