How to Connect the Microsoft Teams Widget from the Widget Marketplace

This article explains how to connect the Microsoft Teams widget to your Teams channel, allowing you to display its content on your screen.

Create a Microsoft Teams widget

Create an Application
  1. Go to https://portal.azure.com/#home.

    Login using an admin account for your organisation
  2. Click "App registrations".

    image.png

  3. Click "New Registration".


    image.png

     
    1. Enter a name: "Signage" or "Organisation messages"
    2. Accounts in this organisational directory only
    3. No redirect url
    4. Click "Register"

      image.png

  4. You will be redirected to the created application.
  5. Copy the value next to "Application (client) ID" and save it.

    image.png

  6. Create a client secret by navigating to "Manage > Certificates & secrets" in the left-hand menu.


    image.png
    1. Create a "New Client Secret".

      image.png

    2. For the description, enter any value, such as "Signage Widget."
    3. Set the expiration to a maximum of 730 days, or choose a shorter duration if preferred.

      image.png

    4. Click "Add".

      image.png

    5. In the row under the "Value" column, click the copy icon to save the Client Secret. Be sure to store it in a text file for later use.

      Important: You cannot view this value again! If you don't copy it now, you'll need to create a new client secret.

      image.png

  7. Add the necessary permissions by navigating to Manage > API permissions in the left-hand menu.

    image.png

  8. Click "Add a permission," then select "Microsoft Graph," followed by "Application permissions."


    image.png

  9. Add the following permissions, then click "Add permissions."

    1. Channel.ReadBasic.All
    2. ChannelMember.Read.All
    3. ChannelMessage.Read.All
    4. ChannelSettings.Read.All

      image.png

    5. Files.Read.All

      image.png

    6. ProfilePhoto.Read.All

      image.png

    7. Sites.Read.All

      image.png

    8. TeamSettings.Read.All

      image.png

    9. User.Read.All

      image.png

  10. Next, click "Grant admin consent for [Your organization]."


    image.png

  11. Click on "Yes" in the popup.
  12. Your application will be ready for use with the widget.

To link the widget to a channel, you'll need the channel's ID. You can retrieve this from within the Microsoft Teams application.

In your team’s channel, click the three dots ("..."") next to the channel name and select "Get link to channel." Click "Copy" and save the link in your text file for later use.

image.png

Now you have the following values saved in your text file:

  • Channel link
  • Application (client) ID
  • Client Secret

In the Widget Marketplace, create an instance of the Microsoft Teams widget and enter the copied values into the corresponding property fields.

image.png

 

Important: Be sure to add a reminder in your calendar to regenerate the token after 730 days (or the interval you selected), as your widget will stop functioning if the token expires.