You can display content in your SharePoint space from websites that allow embedding (like YouTube or Bing maps, for example). For many of them, you can either use the site's web address for the content or embed code that the site provides.
Notes:
-
Some functionality is introduced gradually to organizations that have opted in to the Targeted Release program. This means that you may not yet see this feature or it may look different than what is described in the help articles.
-
In a space, embedded content is shown initially as a thumbnail image that loads the full HTML embed content when in Inspect mode. Users that are using a VR headset will only be able to see the thumbnail.
-
If you're not already in Edit mode, select Edit at the top right of your space.
-
On the canvas, select the circled + icon.
-
Select Embed.
-
Click to place the web part anywhere on the structure (floor).
-
In the properties panel, enter a URL or HTML iframe tag. For more information on how to do this, see the section Use a web site address or embed code in this article.
-
If you either want to specify a specific thumbnail to use in the 3D space or an auto-selected thumbnail is not available, select Custom image. Then select an image. Select Use transparency in image to display the custom image without a backplate and enable transparency.
An auto-selected thumbnail may or may not be available for your content. If an auto-generated thumbnail is not available, the web part will time out and then show a warning icon. In that case, use a custom image.
-
(Optional) Select whether to resize to fit the page. This controls whether the iframe will use all of the available space on screen or match the aspect ratio of the thumbnail image.
Note: If your embedded content is showing with a black border around it, make sure this setting is enabled
-
(Optional) Select your preferences for the Appearance of the image:
-Depth of the panel behind the image
-Corner radius -
Select and enter Alternate text for the thumbnail shown in the space.
-
(Optional) If you want a podium to appear below the image, select Show podium. To set the distance between the image and the podium, use the Height from podium slider.
-
Save as draft or Publish and then Inspect the web part to confirm the embedded HTML content loads as desired.
Notes:
-
If you don't see the property pane, click Edit web part
-
Links to content only work for websites that provide a specific service for embedding content using links. If a link doesn't work for the content you want to embed, try using the embed code instead.
Using a website address or embed code with the SharePoint spaces Embed web part
The embed web part supports a wide array of content that can be specified using either embed code or a website address. Content can include YouTube videos, Bing maps, Office documents such as PowerPoint, Microsoft Forms, or Microsoft PowerApps.
Note: Some content will not have an automatically generated thumbnail available. If the web part loads with a warning indicator as shown here, select the Custom image option and choose an image.
Display content using a website address
You can embed content from some websites by copying and pasting the site's web address for the content into the Embed web part .
-
Copy the link of the embeddable content you want to use. To do this, go to the site with the content you want to embed. Somewhere near the content you will typically see a Share button or link. Click it, and copy the link address provided.
In the property pane of the Embed web part, paste the website address you copied earlier into the Website address or embed code box.
Display content using embed code
Embed code is a list of specific instructions from a website that describe how to display that content on another page. Many sites offer embed codes on their pages for you to copy and paste. You'll typically see a button labeled Embed code or </>. This opens a text box with some code in it.
For example, click the Share button for a video on Vimeo to see the embed code in the share dialog.
To use embed code, do the following:
-
Copy the embed code (if available) for the content you want to use. To do this, go to the site with the content you want to embed. Somewhere near the content you will typically see a Share button or link, or a button labeled Embed code or </>. This will open a text box with some code in it, similar to the image from the Vimeo site above.
-
In the property pane of the Embed web part, paste the embed code into the Website address or embed code box.
Troubleshooting
Here are the most common reasons why embedding may not work:
-
Embed code must be iframe-based (that is, start and end with <iframe> tags). Embed code that uses <script> tags is not supported.
-
Only secure web sites can be embedded. Make sure the URL of the web site begins with HTTPS.
-
Not all websites allow their pages to be embedded, so you may not be able to embed them, even when they are secure and use iframe-based embed code. If you have problems, check with the website to see if they allow embedding.
-
Site collection administrators can control whether users can embed content from external websites. If they don't let contributors embed content, you may see an error message that says, “Embedding content from this website isn't allowed.” See your administrator and/or the help article Allow or restrict the ability to embed content on SharePoint pages.
