> For the complete documentation index, see [llms.txt](https://docs.customiframe.com/llms.txt).
> Use it to discover all available pages before exploring further.

# Embed YouTube Live Stream in Elementor

Step-by-step guide to embed YouTube Live Stream in Elementor using the Custom iFrame WordPress plugin. Stream webinars and events. No coding required.


## Overview

Custom iFrame lets you embed YouTube Live Stream in Elementor by pasting the live stream URL into the widget. Visitors watch the stream directly on your page without leaving your site.

Custom iFrame is a WordPress plugin by CoderzStudio that embeds 100+ external sources in Elementor and Gutenberg without writing any code.

Using Gutenberg instead? Follow the [Embed YouTube Live Stream in Gutenberg](/gutenberg/video/embed-youtube-live) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- Elementor installed
- A YouTube live stream URL or embed link

## Video Tutorial

<iframe
  src="https://www.youtube.com/embed/LtC0RBMV5mo"
  width="720"
  height="405"
  frameBorder="0"
  allowFullScreen
/>

## Step 1: Get the YouTube Live Stream URL

<Steps>
  <Step title="Open YouTube and find the live stream" icon="radio" title-type="p">
    Go to [youtube.com](https://www.youtube.com) and open the live stream you want to embed.
  </Step>
  <Step title="Copy the link" icon="link" title-type="p">
    Click the **Share** button on the live stream. Click **Copy Link** to copy the watch URL.

    For the embed URL format, click **Share** - **Embed** and copy only the `src` value from the iFrame code (e.g. `https://www.youtube.com/embed/VIDEO_ID`). Either format works in Custom iFrame.
  </Step>
</Steps>

## Step 2: Add the Custom iFrame Widget

<Steps>
  <Step title="Open your page in Elementor" icon="layout" title-type="p">
    Go to the page where you want the live stream. Click **Edit with Elementor**.
  </Step>
  <Step title="Drag the widget onto your page" icon="move" title-type="p">
    Search for **Custom iFrame** in the Elementor widget panel. Drag the widget into your layout.
  </Step>
</Steps>

## Step 3: Embed YouTube Live Stream in Elementor

<Steps>
  <Step title="Select YouTube as the source type" icon="youtube" title-type="p">
    In the Content tab, find **Source Type** and select **YouTube**.
  </Step>
  <Step title="Paste the live stream URL" icon="clipboard" title-type="p">
    Paste the live stream URL into the **Source URL** field. The stream player appears in the editor.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776884145/elementor/video/youtube-live/yt-livestream-link.webp"
      alt="Custom iFrame widget in Elementor editor showing YouTube live stream URL in Source URL field with live stream preview"
      width="1920"
      height="838" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Set height and publish" icon="check" title-type="p">
    Set **Height** to 450px or more for a 16:9 stream. Click **Update** or **Publish**.
  </Step>
</Steps>

## Step 4: Configure Basic Options (Pro)

<Callout kind="info">
  Steps 4 through 8 require Custom iFrame Pro (Starter, Studio, or Agency plan).
  [View pricing](https://customiframe.com/pricing) - plans start at $29 one-time.
</Callout>

Control how the embedded live stream behaves on your page:

- **Autoplay:** Start the stream automatically. Mute is required on most browsers for autoplay to work.
- **Mute:** Silence the stream by default. Use with Autoplay for background streams.
- **Show Controls:** Display play, pause, and volume controls.
- **Loop:** Repeat playback. Not typically used for live streams.
- **Privacy Mode:** Use `youtube-nocookie.com` to avoid tracking viewers via cookies.
- **Play Inline on Mobile:** Play the stream inside the page on iOS instead of going fullscreen.

<Image
  src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776869484/elementor/video/youtube/yt-basic-options.webp"
  alt="Custom iFrame Pro YouTube Basic Options in Elementor showing Autoplay, Mute, Controls, Loop, Privacy Mode, and Mobile Inline Playback toggles"
  width="375"
  height="500" priority={true} fetchPriority="high" />

## Step 5: Configure Playback Options (Pro)

- **Start Time (seconds):** Set where playback begins in a recorded replay. Live streams ignore this during the live broadcast.
- **End Time (seconds):** Set where playback stops. Applies to replays.
- **Playlist:** Add comma-separated video IDs to queue multiple streams.

<Image
  src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776869486/elementor/video/youtube/yt-playback.webp"
  alt="Custom iFrame Pro YouTube Playback settings in Elementor showing Start Time, End Time, and Playlist fields"
  width="357"
  height="389"
/>

## Step 6: Configure Appearance Options (Pro)

- **Controls Color:** Choose Red or White for the progress bar. Match your site's color theme.
- **Show Related Videos:** Limit suggestions to the same channel or allow any channel.
- **Allow Fullscreen:** Let viewers expand the stream to fullscreen.
- **Disable Annotations:** Hide pop-up annotations during playback.
- **Enable Keyboard Controls:** Let users control playback with their keyboard.

<Image
  src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776869488/elementor/video/youtube/yt-appearance.webp"
  alt="Custom iFrame Pro YouTube Appearance settings in Elementor showing Controls Color, Related Videos, Fullscreen, Annotations, and Keyboard Controls options"
  width="361"
  height="447"
/>

## Step 7: Configure Captions Options (Pro)

- **Show Closed Captions:** Display captions by default when available.
- **Player Interface Language:** Enter an ISO 639-1 code (e.g. `en`, `fr`, `es`) to set the player controls language.

<Image
  src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776869489/elementor/video/youtube/yt-captions.webp"
  alt="Custom iFrame Pro YouTube Captions settings in Elementor showing Show Closed Captions toggle and Player Interface Language field"
  width="358"
  height="274"
/>

## Step 8: Configure Advanced Options (Pro)

- **Enable YouTube API Support:** Allow JavaScript API interaction for custom player controls or event tracking.
- **Additional URL Parameters:** Add YouTube URL parameters in `param=value` format to fine-tune playback.

<Image
  src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776869491/elementor/video/youtube/yt-advanced.webp"
  alt="Custom iFrame Pro YouTube Advanced settings in Elementor showing YouTube API Support toggle and Additional URL Parameters field"
  width="361"
  height="398"
/>

## Troubleshooting

**Stream shows blank or offline message:** The stream may not have started yet, or the URL points to a past broadcast. Check the stream status on YouTube directly.

**Stream does not autoplay:** Enable **Mute** alongside **Autoplay**. Most browsers block autoplay for videos with sound.

**Player is cut off:** Increase the height or enable **Auto Height** in the Content tab.

For more help, see [iFrame Not Showing](/troubleshooting/iframe-not-showing).

## FAQ

<ExpandableGroup>
  <Expandable title="Can I embed a YouTube live stream before it starts?" default-open="false">
    Yes. The player shows a waiting screen until the stream goes live. Visitors see the stream automatically once it begins, without refreshing the page.
  </Expandable>
  <Expandable title="Do I need Custom iFrame Pro to embed a live stream?" default-open="false">
    No. Basic live stream embedding works with the free version. Pro adds autoplay, captions, privacy mode, and advanced API controls.
  </Expandable>
  <Expandable title="Can I embed a YouTube live stream replay?" default-open="false">
    Yes. After the stream ends, YouTube saves it as a regular video. Paste the same URL and it plays as a replay. Use Start Time and End Time (Pro) to trim the replay.
  </Expandable>
  <Expandable title="What is the difference between the watch URL and the embed URL?" default-open="false">
    Both work. The watch URL (`youtube.com/watch?v=ID`) and the embed URL (`youtube.com/embed/ID`) both load correctly in the Source URL field. Use whichever is easier to copy.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed YouTube Live in Gutenberg" href="/gutenberg/video/embed-youtube-live" icon="layout" horizontal={false}>
    Guide for the WordPress block editor.
  </Card>
  <Card title="Embed YouTube Video in Elementor" href="/elementor/video/embed-youtube" icon="layers" horizontal={false}>
    Full YouTube embed guide with all Pro options.
  </Card>
</Columns>

## Related Guides

- [Embed Video in Elementor - Overview](/elementor/embed-videos)
- [Embed YouTube Video in Elementor](/elementor/video/embed-youtube)
- [Embed YouTube Shorts in Elementor](/elementor/video/embed-youtube-shorts)
- [YouTube Advanced Controls (Pro)](/features/youtube-advanced)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)