How to Embed the Microsoft Stream Video into a SharePoint Page

This article will demonstrate how to embed a Microsoft Stream video to your SharePoint page using the Code Design Element. 

This is what we are going to achieve:

TABLE OF CONTENTS

• Prerequisite
• Interactive Tutorial
• Step-by-step Tutorial
  • Part 1: Copy the Embed Code
    • Step 1: Share the Microsoft  Stream Video
    • Step 2: Copy Embed Code
  • Part 2: Paste the Embed Code
    • Step 1: Edit the ShortPoint Web Part
    • Step 2: Add the Code Design Element
    • Step 3: Paste the Embed Code
    • Step 4: Save

Prerequisite

• You must have the latest version of ShortPoint SPFx installed on your SharePoint environment.
• You must be a ShortPoint Designer with an active license.
• You must already have a Microsoft Stream Video uploaded in your Document library.

Interactive Tutorial

Start the interactive tutorial to learn how to embed Microsoft Strem Videos using the Code Design Element:

Step-by-step Tutorial

The steps have been divided into two parts. Follow closely to get started:

Part 1: Copy the Embed Code

Step 1: Share the Microsoft  Stream Video

• Go to the Microsoft  Stream Video you want to showcase.
• Click Share.

• Select Embed Code.

Step 2: Copy Embed Code

• Customize how you want the Stream Video to look.
• Click Copy Embed Code.

Part 2: Paste the Embed Code

Step 1: Edit the ShortPoint Web Part

• Go to the SharePoint page you want to use and click Edit.

• Select the ShortPoint tag.
• Click the pencil icon.

Step 2: Add the Code Design Element

• Click the plus icon to see the library of Design Elements.
• Use the search bar to look for Code and select it.

Step 3: Paste the Embed Code

• Paste the copied embed code in the HTML field.
• Once satisfied, click the green check mark.

Step 4: Save

• Click the eye icon to see your page in real-time.

• Click Save to apply all your changes.

Congratulations! You now know how to embed Microsoft Stream Videos into your SharePoint page using the Code Design Element.

Related articles:

• Introducing ShortPoint Code Design Element
• How to Embed Third Party Videos into Your Page
• How to Make Tabs Collapsible