If you’re using a new block editor in WordPress (also called Gutenberg) then you might have come across an annoying problem. You might have pasted the YouTube URL into the post in the backend, seen the preview generate automatically and published the post. After checking the live page you saw a surprise – instead of the video preview you only saw the link to YouTube video, and it’s not even clickable. Something like this:

https://www.youtube.com/watch?v=wyMZhqdCwjQ

You might also see some error saying that there was a problem displaying the video.

This is disappointing, and trying to fix it yields no results. This has happened to me and luckily I found a solution.

Three ways to add a YouTube video to WordPress

1. The easiest way is just to paste the URL. After the URL is pasted in the block editor it will fetch the preview and show the controls like this:

2. Another obvious way or creating a YouTube block is clicking the ‘plus’ sign in the editor, and then selecting the YouTube block.

After selecting it paste the video in the block and it will display the preview the same way as in 1).

3. The third way is more innovative. Instead of using the YouTube block, just use the Custom HTML block.

Instead of pasting only the URL to YouTube, go to the actual video in YouTube page, and select “Share”, then “Embed”.

You will receive a sharing code and copy and paste that one into the Custom HTML block in WordPress. The result will be a bit different this time. The editor will not display a preview of a YouTube video, it will display just the code that you have pasted. But that’s okay, so publish the page and review the results.

Test results – demo

Here’s a YouTube video embed with method 1:

Here’s a YouTube video embed with method 2:

Here’s a YouTube video embed with method 3:

On the back-end it looks like only method 1 and 2 work and method 3 does nothing:

However, on the front-end (live site) the result is completely different. Methods 1 and 2 only output a link to the video (without a real link), but method 3 displays the video preview.

The solution

After you check your website for each of the three above described methods, you might be surprised. Only the third method works correctly! And that is also the solution to this problem of YouTube video not showing in WordPress if you used block editor.

I hope that the WordPress team will fix the error which probably lies in YouTube block or some faulty caching. Many people have such problems, but this solution might be handy if you have the same error on your site.

If you see all three videos in the Demo above, that means that WordPress has at least for some cases fixed the problem. If you’ve done all that I wrote in the method 3 and the solution and YouTube still doesn’t work, you might want to try updating WordPress to the latest version.