PnP site template - include 'Embed' webpart with <iframe>
-
08-02-2021 - |
質問
I am provisioning sharepoint sites using a pnp site template and would like to add an embed web part. I am able to add 'people' web parts with the following:
<pnp:CanvasControl WebPartType="People" JsonControlData="{"id": "7f718435-ee4d-431c-bdbf-9c4ff326f46e", "instanceId": "7aca25b7-b4a9-48e5-a97f-1527a0140b52", "title": "People", "description": "People", "dataVersion": "1.3", "properties": {"layout":1,"persons":[]}, "serverProcessedContent": {"htmlStrings":{},"searchablePlainTexts":{"title":""},"imageSources":{},"links":{}}, "dynamicDataPaths": {}, "dynamicDataValues": {}}" ControlId="7f718435-ee4d-431c-bdbf-9c4ff326f46e" Order="1" Column="3" />
The CanvasControl
contains a WebPartType
, JsonControlData
, ControlId
, order
and column
properties.
Changing the WebPartType
to Embed
is a given, but where does the <iframe>
markup for the embed go?
解決
I reversed engineered it by adding the embed web part to a sharepoint site manually and exporting the template with powershell. The <iframe>
markup is included in the JsonControlData as follows (I have removed all Ids):
JsonControlData=
"{"id": "<id>",
"instanceId": "695e4f54-bebc-43b1-9e4f-1efbe116cda9",
"title": "Bygg inn", "description":
"Bygg inn innhold fra andre områder, for eksempel Sway, YouTube, Vimeo og flere",
"dataVersion": "1.2",
"properties":
{
"embedCode":"<iframe
width=\"1024px\"
height=\"575px\"
src=\"https://web.powerapps.com/webplayer/iframeapp?source=iframe&
screenColor=rgba(104,101,171,1)&
appId=/providers/Microsoft.PowerApps/apps/<PowerAppId>;
GroupObjectId=<groupid>\"></iframe>",
"cachedEmbedCode":"<
iframe width=\"1024px\"
height=\"575px\"
src=\"https://web.powerapps.com/webplayer/iframeapp?source=iframe&
screenColor=rgba(104,101,171,1)&
appId=/providers/Microsoft.PowerApps/apps/<PowerAppId>&
GroupObjectId=<groupid>\"></
iframe>",
"shouldScaleWidth":true,
"tempState":{},
"thumbnailUrl":"",
"cachedEmbedCodeThumbnail":""},
"serverProcessedContent":
{"htmlStrings":{},
"searchablePlainTexts":{},
"imageSources":{},
"links":{}
},
"dynamicDataPaths": {},
"dynamicDataValues": {}
}"
This is not very readable and hard to reproduce so I would recommend to do it by adding it manually and exporting the template.
EDIT: this is my original iframe
, for reference:
<iframe width="1024px" height="575px"
src="https://web.powerapps.com/webplayer/iframeapp?
source=iframe&screenColor=rgba(104,101,171,1)
&appId=/providers/Microsoft.PowerApps/apps/<PowerappId>
&GroupObjectId=<groupid>">
</iframe>