How To Embed Livestreamed Video On Your Site



This is a collection of tips to embed your working YouTube Live stream into your website:

How to embed livestreamed video on your site free

Update: If you have trouble getting the “Embed live streams” feature activated in YouTube, you can try Twitch for live streaming instead. Please seeHow to stream your IP camera to Twitch

Requirements

Choose Twitch or YouTube from the Choose your streaming platform menu. To add a Twitch livestream, find your channel name (usually located next to your profile picture, or at the top of your channel page). Copy that name and paste it into the Channel field on your website. To add a YouTube livestream feed, copy the link to your livestream video.

The features “Live streaming” and “Embed live streams” need to be enabled in https://www.youtube.com/features. Please follow the instructions there.

To embed into your website, stream privacy needs to be set to “unlisted” or “public” and a linked AdSense account seems to be required (?).

  1. Some implementations embed the video player in their site while hosting the videos somewhere else. We are going to embed the video player in our site and host the files locally (a popular option.
  2. Check out this video player software for MS-Windows which does both - it imports your movie file, convert into FLV format, and then you can choose a flash video player skin, it will then either generate a HTML page with the video player embed inside it, or generate a section of HTML code for you to copy and paste into your HTML page.
  3. You can embed a video on your Wix site with just a few simple steps. Click the Wix App Market icon on the left side of the editor In the app search, type “HTML embed” Click “Add to Site”.
  4. Click and scan the selections, choosing the option that reads 'embed.' Copy that code to your computer's clipboard. Step 3: Create a new page or blog entry on your site. Select the Embed Code element and drop it where you want.

Embed

  1. Open YouTube Studio
  2. Open the stream from the “Manage Tab” on the left
  3. Click Share arrow in the upper right and select embed in the dialog footer to get the embed HTML code, example:

    <iframe width='560' height='315' src='https://www.youtube.com/embed/XYZ123' frameborder='0' allowfullscreen></iframe>

How To Embed Livestreamed Video On Your Site

Add this into your website HTML, and open the website in anonymous browser window to check if the stream displays without error message.

Site

Permanent URL

If you only have one stream in your account, we recommend using a permanent URL, so link does not change if you need to recreate the stream.

  1. Get the Channel ID from https://www.youtube.com/account_advanced. Not the User ID!

  2. Change the code to use the Channel ID (12345 in this example):

    <iframe width='560' height='315' src='https://www.youtube.com/embed/live_stream?channel=12345' frameborder='0' allowfullscreen></iframe>

And, there is a permanent link to your live stream (always referencing the first stream in your channel): https://www.youtube.com/channel/YOUR_CHANNEL_ID/live

How To Embed Livestreamed Video On Your Site Free

Livestreamed

References

How to stream MJPEG to YouTube Live

YouTube Live only allows H.264 encoded video stream for RTMP input. So if you want to stream your (old) IP camera, only supporting MJPEG video streams, you have to transcode your video stream to a format YouTube accepts.

How to stream Mobotix MxPEG to YouTube Live

How To Embed Livestreamed Video On Your Site Without

If your Mobotix camera does not support H.264, you can still use the MxPEG video encoding to have some advantages compared to MJPEG, like lower bandwidth usage and more motion detail.