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 guide.

Requirements

Custom iFrame plugin installed and active
Elementor installed
A YouTube live stream URL or embed link

Video Tutorial

Step 1: Get the YouTube Live Stream URL

Open YouTube and find the live stream

Go to youtube.com and open the live stream you want to embed.

Copy the link

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.

Open your page in Elementor

Go to the page where you want the live stream. Click Edit with Elementor.

Drag the widget onto your page

Search for Custom iFrame in the Elementor widget panel. Drag the widget into your layout.

Step 3: Embed YouTube Live Stream in Elementor

Select YouTube as the source type

In the Content tab, find Source Type and select YouTube.

Paste the live stream URL

Paste the live stream URL into the Source URL field. The stream player appears in the editor.

Custom iFrame widget in Elementor editor showing YouTube live stream URL in Source URL field with live stream preview

Set height and publish

Set Height to 450px or more for a 16:9 stream. Click Update or Publish.

Step 4: Configure Basic Options (Pro)

Steps 4 through 8 require Custom iFrame Pro (Starter, Studio, or Agency plan). View pricing - plans start at $29 one-time.

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.

Custom iFrame Pro YouTube Basic Options in Elementor showing Autoplay, Mute, Controls, Loop, Privacy Mode, and Mobile Inline Playback toggles

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.

Custom iFrame Pro YouTube Playback settings in Elementor showing Start Time, End Time, and Playlist fields

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.

Custom iFrame Pro YouTube Appearance settings in Elementor showing Controls Color, Related Videos, Fullscreen, Annotations, and Keyboard Controls options

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.

Custom iFrame Pro YouTube Captions settings in Elementor showing Show Closed Captions toggle and Player Interface Language field

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.

Custom iFrame Pro YouTube Advanced settings in Elementor showing YouTube API Support toggle and Additional URL Parameters field

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.

FAQ

Yes. The player shows a waiting screen until the stream goes live. Visitors see the stream automatically once it begins, without refreshing the page.

No. Basic live stream embedding works with the free version. Pro adds autoplay, captions, privacy mode, and advanced API controls.

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.

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.

Also Available For

Embed YouTube Live in Gutenberg

Guide for the WordPress block editor.

Embed YouTube Video in Elementor

Full YouTube embed guide with all Pro options.

Was this page helpful?

Last updated today

Built with Documentation.AI