This fourth article of our series on Modern SharePoint Web Parts focuses on a set of web parts which allow you to embed code to render some external content on a modern SharePoint page. The Kindle and YouTube web parts allow you to preview books or videos on your page via embed codes from those services. And the Embed web part is essentially the same, but for any other content which provides you with embed code.
Embed Web Part
We’ll look at the Embed web part first, since it’s more general, but also more flexible.
When you select the Embed Web Part, the editing panel immediately appears, allowing you to paste a secure website address or iframe-based embed code for external content which allows embedding. Note that script tags are not supported.
Within the box, you simply enter either a secure URL (i.e. one beginning with https:// that contains content), or an embed code provided by some service. For example, on Slideshare you can get an embed code in the Share area of a slide deck. Note that you can specify a size and beginning slide (in this case), which will modify the embed code to present the slides in the way that you wish.
In this example, you would copy and paste the Embed code into the SharePoint Embed web part.
The result is that your slides are embedded on the SharePoint page, and people can advance through them just as they would on Slideshare.
Did you notice the note in the configuration pane about connecting the Embed web part to a list or library to display dynamic content? It’s easy to miss, but it’s pretty cool functionality.
We wrote in detail about connecting an Embed web part to a list or library in a previous article on web part connections in SharePoint Online.
Note that the Embed web part had also previously been the way to embed a PowerApp on the page. But now there is a Microsoft PowerApps modern web part, which we’ll cover in a future article.
Note also that a Site Collection Administrator may restrict the ability to embed code on a SharePoint page. So if you find you cannot do this, you may need to check with your admin.
Kindle Instant Preview Web Part
The Kindle Instant Preview web part lets you allow people to see a sample of a book, and purchase it if they wish. It uses an embed code just like the Embed web part does, but the web part configuration pane includes several options specific to a Kindle book.
Learn about getting the appropriate embed code on Amazon’s Kindle Instant Preview page. Basically you search for a book, and click on Embed to get the preview embed code.
In the dialog box, select the Embed option, and you can also choose the size, whether to show the content in place, and whether or not to show a Buy or Share button. The same options are available within the web part after you insert the code, but if you want or need to use the code in a standard Embed web part rather than the Kindle web part, setting the options on Amazon’s site will modify the code appropriately.
The result is a nice preview on your page, allowing you to recommend or promote a book. Clicking on Preview opens the book and displays a certain amount of actual content.
Set-SPOTenant -DisabledWebPartIds 46698648-fcd5-41fc-9526-c7f7b2ace919 (See this page for reference.)
YouTube Web Part
The YouTube web part lets you embed a YouTube video on your page, allowing users to play the video directly from there. This is different from the Link Web Part, which will only display a preview of a video and require the user to actually follow the link to play it.
Its configuration and features are much the same as the Kindle web part discussed above, but with video content. Learn how to get the appropriate embed code from this YouTube help page. This page also describes how to set the video to start at a certain time, play automatically, or include captions.
As with the Kindle web part, the same options are available within the web part, but you can set them in the code from YouTube if you’re using a standard Embed web part.
After pasting the code and making any settings changes, you have a YouTube video right on your page, with player controls people are used to using.
A SharePoint Online Administrator can also hide the YouTube web part via PowerShell, as they can with the Kindle web part. If you are an Administrator who wishes to hide the Kindle web part, use the following PowerShell cmdlet:
Set-SPOTenant -DisabledWebPartIds 544dd15b-cf3c-441b-96da-004d5a8cea1d
NOTE: The Kindle and YouTube web parts are not available in SharePoint 2019. So in that environment you would need to use the more generic Embed web part to achieve the same effect, but without some of the special settings available in the more specific web parts. You would need to set those options on the Amazon or YouTube site before copying the embed code.
In conclusion, the Embed web part and its product-specific cousins provide a great way to enliven any SharePoint page with media and other external content.
Reference:
Ussia, S. (2019). Modern SharePoint Web Parts: Embed, Kindle, YouTube. Available at: https://lightningtools.com/blog/modern-sharepoint-web-parts-embed-kindle-youtube [Accessed: 2nd January 2020].