How to Show a Specific User Events from a Specific Outlook Calendar

NOTEThis feature will be released in version 8.6.0.0 for SharePoint Online and is not currently available.

Want to display events from a particular user? It's super easy with the Microsoft Graph API connection! Simply use the "User's Events from Specific Calendar" use case, and you're all set. Just follow these simple steps below to get started.

TABLE OF CONTENTS

• Prerequisites
• 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 User’s Events from Specific Calendar Use Case
  • Step 6: Map Items
  • Step 7: Save

Prerequisites

• You must have ShortPoint SPFx version 8.6.0.0 or later installed in 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 (Calendars.Read) 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.).
• You must have an Outlook calendar with events:

Step-by-step Tutorial

Follow the steps below to get started:

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 Events.

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 User’s Events from Specific Calendar Use Case

Search for User’s Events from Specific Calendar and select it:

You will be prompted to fill in the details under Query Parameters.  First, write the email of the user whose events you want to pull:

Then, let’s get the Calendar ID of the Outlook Calendar you want to use. Click Get Parameter:

NOTETo learn more about Calendar ID, check out Outlook Calendar ID: What It Is and How to Find It.

Find the calendar you want to use and copy its ID:

Then, click Go Back:

Paste the copied ID in the Calendar ID field:

Add the [1] Start Date and  [2] End Date you prefer:

NOTEYou can use placeholders to point to dynamic dates. Check out How To Use Placeholders In ShortPoint Connections to learn more about placeholders.

Click Run Query:

Select Connect:

Step 6: 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 meeting names as the titles.
2. #start_dateTime in the Start Date field - shows the starting date and time of the meeting.
3. #end_dateTime in the End Date field - shows the end date and time of the meeting.
4. #location_0_displayName in the Location field - displays the location name of the meetings.

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

Step 7: 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 a specific user’s events.

TIPHave lots of events? Help your viewers easily find the event they’re looking for with the Search & Filter Toolbar! It lets them search, sort, and filter through events in seconds. 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
• Microsoft Graph API: Use Cases