Video's in WEM

The hosting of videos in your projects is not something we support, as hosting videos generate significant data traffic, which can strain network resources. Hosting videos also requires substantial storage space adding load to server infrastructure and SQL databases are not optimized for video hosting.

As a solution we advice to use embedded videos in interaction screens. Embedding Iframes is supported by most major hosting providers and allows you to display access-protected videos.

The Widget

Properties

Property	Datatype	Description
Source	Dropdown	Host or service where video is provided from. You can use the other option and provide a full embed "src" URL for providers not in the list.
Video ID	Text, Expression	The ID of the video, this is part of the video url. For most sites this is at the end of the url, for example: https://www.youtube.com/watch?v={VideoID}
Video URL	Text, Expression	The source url of the video, this url should be an embed link source. Open the share menu end select embed, look for src="{the link}" For example: https://www.youtube/embed/{videoID} https://www.player.vimeo.com/video/{videoID}
Allow Fullscreen	Boolean, Toggle	Enable or disable the fullscreen option in the player.
Width	Number	Width of the videoplayer block in pixels. The aspect ration of the video is kept intact.
Height	Number	Height of the video player in pixels. The aspect ration of the video is kept intact.

Finding the src URL can sometimes be a little tricky, but with most hosting sites it can be found as part of the embed script. In the example below you see the script Microsoft stream returns when selecting share -> embed code, where src="VideoURL" .

<iframe
	src="https://company-my.sharepoint.com/folder/user/embed.aspx?UniqueID=Scenario=EmbedDialog.Create"" 
	width="640" 
	height="360" 
	frameborder="0" 
	scrolling="no" 
	allowfullscreen 
	title="2024-01-08 12-46-15.mkv">
</iframe>

When you use private videos or videos hosted behind a login you can use the authentication node to force a user to first log the session into the hosting provider and allow the user to see the video. Alternatively with videos hosted in Microsoft stream a user can log into their Microsoft account through the player without leaving the project.

Adding a widget

Download the widget file attached at the bottom of this page, and add it to your work-space's widget library. To do this start by navigating to the Templates, Widget, Files tab in the resource pane and right click widgets to open the widget editor. Navigate to your current workspace and right-click to create a library and import the widget with another right-click on the library you just made. Browse to the downloaded zip file and confirm the widget is now added to the library and can be made available for use in your project.

Attachment

2KB

Embed Video Player.zip

archive