Embed YouTube Live Stream in Gutenberg

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

Overview

Custom iFrame lets you embed YouTube Live Stream in Gutenberg by pasting the live stream URL into the block. 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 Elementor instead? Follow the Embed YouTube Live Stream in Elementor guide.

Requirements

Custom iFrame plugin installed and active
WordPress with the Gutenberg block editor
A YouTube live stream URL or embed link

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.

Step 2: Install the Plugin and Add the Block

Install and activate the plugin

Go to your WordPress dashboard. Go to Plugins > Add New. Search for Custom iFrame by Coderz Studio, click Install Now, then click Activate.

WordPress Add New Plugin screen showing Custom iFrame by Coderz Studio in search results with Install Now button

Open your page in the block editor

Go to the page or post where you want the live stream. Click Edit to open the Gutenberg block editor.

Add the Custom iFrame block

Click the Add Block button. Search for Custom iFrame. Click the block to add it to the page.

Step 3: Embed YouTube Live Stream in Gutenberg

Select YouTube as the source type

Select the Custom iFrame block. In the right panel, 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 inside the block in the editor.

Set height and publish

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

Step 4: Configure Advanced Playback (Pro)

The options below require Custom iFrame Pro (Starter, Studio, or Agency plan). View pricing — plans start at $29 one-time.

Autoplay: Start the stream automatically. Enable Mute alongside Autoplay — browsers require it.

Mute: Silence the stream by default. Use with Autoplay for background streams.

Show Controls: Display play, pause, and volume controls.

Loop: Repeat playback. Typically not used for live streams, but useful for replays.

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.

Start Time / End Time: Set where playback begins and ends (in seconds). Applies to replays.

Show Closed Captions: Display captions by default. Improves accessibility.

Enable YouTube API Support: Allow JavaScript API interaction for custom player controls or event tracking.

Click Update or Publish. Your YouTube Live Stream is now live on your WordPress site.

For all block settings, see the Set Up Custom iFrame in Gutenberg guide.

This guide showed you how to embed YouTube Live Stream in Gutenberg using the Custom iFrame plugin. From copying the stream URL to selecting YouTube as the source type and publishing, the whole setup runs through the block editor without any code.

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 block settings.

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 Elementor

Guide for the Elementor widget.

Embed YouTube Video in Gutenberg

Full YouTube embed guide with all Pro options.

Was this page helpful?

Last updated today

Built with Documentation.AI