With the REST API connection, you can get the total number of members in a SharePoint group and connect it to a Design Element. This solution will display a live member count that updates automatically on your SharePoint page. Follow the steps below to learn how to accomplish this.
NOTEFor this guide, we will be using the Counter Boxes Design Element. However, you can use any Design Element you prefer.
TABLE OF CONTENTS
Prerequisites
- You must have the latest version of ShortPoint SPFx installed on your SharePoint environment.
- You must be a ShortPoint Designer with an active license.
- You must already have the Design Element you want to use to connect on your SharePoint page.
Step-by-step Tutorial
Follow the steps below to learn how to get the total number of members in a SharePoint group and connect it to a Design Element:
Step 1: Edit the ShortPoint Web Part
Go to the SharePoint page you want to use and click Edit:
Close the Toolbar:
Edit the ShortPoint web part:
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
NOTEFor this guide, we will be using the Counter Boxes Design Element. However, you can use any Design Element you prefer.
Click the cogwheel icon of the Design Element you’ll use:
Step 4: Connect to People in SharePoint Group
Go to the Connect tab:
Select People in SharePoint Group:
Select the [1] name of the group you want to use and click [2] Connect:
Step 5: Get the REST API URL
Right-click anywhere and click Inspect:
The Devtools will open in a separate window. Go to the Network tab:
Look for users?$orderby= and click it:
Copy the URL in the Request URL field:
Step 6: Disconnect
Go back to the SharePoint page and click Disconnect:
Select Back to Connections:
Step 7: Connect to REST API
Select REST API:
Paste the URL you copied in Step 5 in the field provided:
Toggle on Enable Advanced Settings:
Copy the code below:
const length = data.d.results.length; return [{length: length}];
Paste the code in the Map Results field:
Select Connect:
Step 8: Map Items
Go to the Items tab:
Delete the default content:
In the Counter Number field, click the [1] link icon and select [2] length:
Write the [1] Title and choose an [2] Icon:
Step 9: Save
Click Preview to see how the Design Element will look:
Once satisfied, click Update:
Select the eye icon to see your page in real-time:
Save your changes:
That’s it! You can now connect a Design Element to the total number of members in a SharePoint Group.
Related articles: