How to Embed a YouTube Live Stream on Your Website (Permanent URL)
Embed your 24/7 webcam live stream directly on your website, so visitors watch on your page instead of leaving for YouTube. This guide covers the embed method that keeps working when your stream restarts, every parameter the YouTube player accepts for live streams, and how to make the player recover on its own after an outage.
Short version — replace YOUR_CHANNEL_ID and you are done:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID"
title="Live webcam" frameborder="0"
allow="autoplay; encrypted-media; picture-in-picture" allowfullscreen></iframe>No stream yet? Set one up first: YouTube Live Setup.
The problem: Video IDs change
When you click Share → Embed on a live video, YouTube gives you code with a Video ID:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/VIDEO_ID"
frameborder="0" allowfullscreen></iframe>Don’t use this for webcam streams. Every time your stream ends and restarts (network hiccup, camera reboot, YouTube-side hiccup), YouTube creates a new Video ID — and your embedded player shows an ended video until you edit the page again.
The solution: Permanent Channel ID embed
Use the live_stream endpoint with your Channel ID instead. It resolves to whatever is currently live on your channel, every time the page loads:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID"
title="Live webcam" frameborder="0"
allow="autoplay; encrypted-media; picture-in-picture" allowfullscreen></iframe>Find your Channel ID in YouTube Studio under Settings → Channel → Advanced settings. It starts with UC and is 24 characters long — this is not your @handle.
This pairs naturally with webcam.io’s Scheduled Streams: each new broadcast webcam.io creates after an outage is picked up by the same embed code without any change on your site.
Embed parameters reference
YouTube does not document the live_stream endpoint separately — it accepts the standard IFrame Player parameters. Append them with & after the channel:
https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&autoplay=1&mute=1&controls=0
| Parameter | Values | Effect on a webcam embed |
|---|---|---|
channel |
UC… |
Required. The channel whose current live stream is shown. |
autoplay |
0 / 1 |
Start playing on page load. Browsers only allow this muted — combine with mute=1, and the iframe needs allow="autoplay". |
mute |
0 / 1 |
Start muted. Required for autoplay in Chrome, Safari and Firefox. |
controls |
0 / 1 |
0 hides the control bar (kiosk / digital signage). The YouTube logo and title stay. |
rel |
0 / 1 |
0 limits the related videos shown when playback stops to your own channel. They cannot be switched off completely. |
playsinline |
0 / 1 |
1 plays inline on iPhone/iPad instead of forcing fullscreen. |
fs |
0 / 1 |
0 removes the fullscreen button. |
disablekb |
0 / 1 |
1 disables keyboard shortcuts (space, arrows). Useful for signage. |
hl |
en, de, … |
Player interface language. Defaults to the visitor’s browser. |
enablejsapi |
0 / 1 |
1 lets your page control the player with JavaScript (see auto-recover). |
origin |
https://your-site.com |
Your page’s origin. Set it whenever enablejsapi=1 is used. |
Not applicable to live streams: start, end, loop, playlist. No effect anymore: modestbranding (deprecated by YouTube in August 2023) — there is no supported way to remove the YouTube logo from the player.
Copy-paste variants
Standard — click to play, sound on:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&rel=0"
title="Live webcam" frameborder="0"
allow="encrypted-media; picture-in-picture" allowfullscreen></iframe>Autoplay, muted — the typical webcam page:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&autoplay=1&mute=1&playsinline=1&rel=0"
title="Live webcam" frameborder="0"
allow="autoplay; encrypted-media; picture-in-picture" allowfullscreen></iframe>Kiosk / digital signage — no controls, no keyboard, no fullscreen button:
<iframe width="1920" height="1080"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&autoplay=1&mute=1&controls=0&disablekb=1&fs=0&playsinline=1&rel=0"
title="Live webcam" frameborder="0"
allow="autoplay; encrypted-media"></iframe>Responsive embed (recommended)
Modern browsers (2021+) support aspect-ratio, which makes the player scale with the page width in one line of CSS:
<iframe
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&autoplay=1&mute=1&playsinline=1"
style="width: 100%; aspect-ratio: 16 / 9; border: 0;"
title="Live webcam"
allow="autoplay; encrypted-media; picture-in-picture" allowfullscreen></iframe>If you need to support older browsers, use the padding-bottom wrapper instead:
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
<iframe
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;"
title="Live webcam" allowfullscreen></iframe>
</div>56.25% is 9 ÷ 16. For a 4:3 camera use 75%.
If the player sits further down the page, add loading="lazy" to the iframe so it only loads when scrolled into view. Don’t combine that with autoplay=1 for a player above the fold.
Auto-recover after a stream restart
The Channel ID embed resolves the current broadcast when the page loads. If your stream ends while a visitor is watching (camera reboot, network outage) and webcam.io starts a new broadcast, the player stays on the ended one until the visitor reloads.
With the IFrame Player API the page can do that itself: listen for the ended state and replace the player after a short delay.
<iframe id="webcam-player"
src="https://www.youtube.com/embed/live_stream?channel=YOUR_CHANNEL_ID&autoplay=1&mute=1&playsinline=1&enablejsapi=1&origin=https://your-site.com"
style="width: 100%; aspect-ratio: 16 / 9; border: 0;"
title="Live webcam"
allow="autoplay; encrypted-media; picture-in-picture" allowfullscreen></iframe>
<script src="https://www.youtube.com/iframe_api"></script>
<script>
var RETRY_AFTER_MS = 60000; // give webcam.io time to start the next broadcast
function attachPlayer() {
new YT.Player('webcam-player', {
events: {
onStateChange: function (event) {
if (event.data === YT.PlayerState.ENDED) {
setTimeout(reloadPlayer, RETRY_AFTER_MS);
}
}
}
});
}
function reloadPlayer() {
// Swap in a fresh iframe with the same attributes and attach the API again.
var old = document.getElementById('webcam-player');
var fresh = old.cloneNode();
old.parentNode.replaceChild(fresh, old);
attachPlayer();
}
// Called by the IFrame API once it has loaded.
function onYouTubeIframeAPIReady() {
attachPlayer();
}
</script>Replace https://your-site.com with the origin of the page that contains the embed (scheme + host, no path). If no new broadcast is live yet when the player reloads, it shows YouTube’s “unavailable” message; the visitor’s next reload — or a second timer of your own — picks it up.
Enable Backup stream in your webcam.io stream settings. It keeps the YouTube broadcast alive through short camera or network outages, so most restarts never reach the visitor in the first place.
Embedding in WordPress, Wix, Squarespace & Co.
Every builder that lets you paste raw HTML works. Pasting the plain URL does not — the automatic YouTube preview (oEmbed) only understands video links, not the live_stream URL.
- WordPress
-
Add a Custom HTML block and paste the iframe. If the block is stripped on save, your user role lacks the
unfiltered_htmlcapability (common on multisite and some managed hosts) — ask an administrator to insert it, or use a plugin that allows iframes. - Wix
-
Add → Embed Code → Embed HTML, paste the iframe. Wix wraps it in its own frame, so use
width="100%"and theaspect-ratiostyle above; a fixed pixel height also works. - Squarespace
-
Add a Code block (or an Embed block, then click the
</>icon) and paste the iframe. Code blocks require a Business plan or higher. - Webflow
- Drag an Embed element onto the page and paste the iframe.
- Google Sites
- Insert → Embed → Embed code, paste the iframe.
Permanent link without an embed
For buttons, emails or a “watch live” menu item, link to the channel’s live page. It redirects to whatever is live right now:
https://www.youtube.com/channel/YOUR_CHANNEL_ID/live
https://www.youtube.com/@your-handle/live
If nothing is live, the link opens your channel page instead.
Multiple cameras on one page
The live_stream endpoint shows one stream per channel. For several cameras, the reliable setup is one YouTube channel per camera — you can create additional channels (Brand Accounts) under the same Google account, each with its own permanent Channel ID embed.
Running several streams from one webcam.io account is described in Multiple YouTube streams.
Checklist before embedding
- Stream visibility is Public. Unlisted streams can be embedded by Video ID, but the Channel ID endpoint may not find them.
- “Allow embedding” is enabled: YouTube Studio → your stream → Edit → More options.
- YouTube may require a linked AdSense account for live-stream embedding on some channels.
- Use Scheduled Streams in your webcam.io setup — the default “Stream now” mode is not built for 24/7 streaming (see YouTube Live Setup).
- Test the embed in a private/incognito window: your own login can mask visibility and embedding errors.
Troubleshooting
- Player shows “Video unavailable”
- Embedding is disabled, the stream is Private, or AdSense linking is required for your channel. Check all three in YouTube Studio, then retest in an incognito window.
- Player shows an old, ended stream
- You embedded a Video ID. Switch to the Channel ID method above.
- Autoplay doesn’t work
-
Add
mute=1andallow="autoplay"on the iframe — browsers block autoplay with sound. On iPhone also addplaysinline=1. - Nothing live right now
- The Channel ID embed shows an error while no stream is live. Enable the Backup stream option in webcam.io, and check Troubleshooting if the stream itself keeps stopping.
- Works on my site, not on a customer’s site
-
Their page probably loads over
http://or inside another iframe withoutallowpermissions. Serve the page over HTTPS and passallow="autoplay; encrypted-media"on every iframe in the chain. - Using the IFrame API and getting
onError -
Code
100means the video is private or removed,101/150mean the owner disallows embedding,2means a malformed parameter (usually a wrong Channel ID). - Embedding still won’t work
- Consider Twitch instead — embedding is simpler and has no AdSense requirement.
FAQ
- Do visitors have to reload after my stream restarts?
- Yes, by default: the embed resolves the live broadcast once, when the page loads. The auto-recover script handles it for them.
- Does the embed count as YouTube views and watch time?
- Yes. Views and watch time from embedded players are attributed to your channel like views on youtube.com.
- How much delay does the embed have?
- The same as on YouTube: roughly 10–30 seconds with Normal latency, a few seconds with Low or Ultra-low. You choose this per stream in YouTube Studio; lower latency disables some features such as higher resolutions, which rarely matter for a webcam.
- Can I hide the YouTube logo or title?
-
No.
controls=0removes the control bar, but the logo and the title overlay remain — YouTube’s terms don’t allow removing them. - Can I use the privacy-enhanced domain?
-
Yes.
https://www.youtube-nocookie.com/embed/live_stream?channel=…accepts the same parameters and sets no tracking cookies until the visitor presses play. It still loads YouTube scripts, so a consent banner may still be required in the EU. - Can I embed a Private stream?
- No. Private videos cannot be embedded at all. Use Public for the Channel ID embed; Unlisted keeps the stream off your channel page and out of search, but only works reliably with Video ID embeds.
- Can I embed the stream on more than one site?
- Yes. The same iframe code works on any number of pages and domains.
Ready to put your camera live? Start your free 7-day trial — no credit card required.