Try ShortPoint nowIn this article we will show you how you can display page properties using ShortPoint Design Elements.
To complete this task we are going to use the REST API connection type. Please, follow the steps below.
TABLE OF CONTENTS
- Before we begin
- Prerequisite
- Step 1: Add a ShortPoint Design Element to the page
- Step 2: Connect your ShortPoint Design Element to REST API
- Step 3: Map the Items and save your page
- Result
Before we begin
- You need to have ShortPoint installed on your SharePoint site(s).
- You need to be a ShortPoint User with an active license.
- This solution works for both classic and modern pages.
- Platforms supported:
- Office 365
- SharePoint 2019 (SharePoint Online)
- SharePoint 2016 On-Premise
- SharePoint 2013 On-Premise
Prerequisite
In your Site Pages library, you need to have the page properties you would like to display on your pages.
You can add page properties by creating a new column in the Site Pages library and editing its value for your page(s) using Properties option:
Modern experience:
Classic experience:
In this example we will display the Title and Contact Person page properties, that we have added:
Step 1: Add a ShortPoint Design Element to the page
Add any ShortPoint Design Element to the page. For the purpose of this article, we will add the Alert Design Element.
Modern experience:
In the edit mode of the page, click Edit the web part button:
Click the big blue plus icon to insert the ShortPoint and open the Page Builder:
Classic experience:
In the edit mode of the page, choose Insert from the ribbon and press the ShortPoint Insert button to open the Page Builder:
Then, choose the Alert Design Element from the Page Builder grid:
The settings of the element will open.
Step 2: Connect your ShortPoint Design Element to REST API
Switch to the Connect tab of the Design Element's settings and choose REST API from the connection types:
Paste your website URL into the REST API URL field:
Configure Change Path setting
Enable Advanced Settings:
Scroll down a bit and paste the following piece of code to the Change Path field:
var _spPageContextInfo = shortpoint._spPageContextInfo;
return _spPageContextInfo.webServerRelativeUrl + "/_api/web/lists/getbyid('" + _spPageContextInfo.pageListId +"')/items/getbyid(" + _spPageContextInfo.pageItemId +")";
Set Up Connection
Click Connect and wait for the connection to load.
Step 3: Map the Items and save your page
Switch to Items/Content tab.
Here, by using the chain icon button, select the page properties columns that you would like to display. For more information please check our article: ShortPoint Connect: Basic Tutorial.
After the Items are mapped, you may click Preview to see your changes:
Then, click Update and save your page.
Result
Here is how it might look like on your page:
That's it. Happy connecting!
Related articles:
