We Keep Coding

Can you embed a YouTube video in a Jupyter Notebook?

I am trying to embed a YouTube video into an existing Jupyter notebook, using the embed code and an iframe. I have seen a few other solutions where they use a code cell which is then executed - but this is not desirable, as outlined below.
I would like to embed the iframe directly into a markdown cell in the notebooks. This way we can re-use the same notebook markdown with a variety of kernels without having to change the code cells.
Do you know if this is possible or not? Does it require installing any additional tools (e.g. Node.js)?
For a minimal example, suppose I wanted to embed this code in a markdown cell:
<iframe width="560" height="315" src="https://www.youtube.com/embed/jZ952vChhuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
If I include it in a markdown cell as follows:
# My Markdown Video
This is where the video should go:
<iframe width="560" height="315" src="https://www.youtube.com/embed/jZ952vChhuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>```
But it's not here.
However, when this markdown cell is rendered (run) the iframe does not show up; it's just a blank. It will display if you try to print the notebook, but it's not interactive.

Not in markdown but you can use %%html at the top of a code block that doesn't mind what kernel type you're using to embed the video:
%%html
<iframe width="560" height="315" src="https://www.youtube.com/embed/jZ952vChhuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Lazy Loading a Youtube Iframe still causing youtube scripts to be loaded on initial page load

I'm trying to optimize the loading of a youtube video which is at the bottom of a page – well out of the viewport, and must be scrolled to. I'm using the solution proposed here: https://web.dev/iframe-lazy-loading/
The problem is that on page load, in the dev tools network tab all the youtube external scripts are loading, causing a bottle neck. From what i understand, that code shouldn't be triggered at all until scrolling to the video position on the page.
This works fine in Safari, but Chrome desktop it loads everything at once, pretty much neglecting any lazy loading.
<iframe loading="lazy" width="560" height="315" data-src="https://www.youtube.com/embed/xxxxxxx" class="lazyload" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<script>
if ('loading' in HTMLIFrameElement.prototype) {
const iframes = document.querySelectorAll('iframe[loading="lazy"]');
iframes.forEach(iframe => {
iframe.src = iframe.dataset.src;
});
console.log('Browser supports lazyloading');
} else {
// Dynamically import the LazySizes library
const script = document.createElement('script');
script.src =
'https://cdnjs.cloudflare.com/ajax/libs/lazysizes/5.2.2/lazysizes.min.js';
document.body.appendChild(script);
console.log('Browser DOES NOT support lazyloading');
}

Vimeo video autoplay is not working on iPhone

I have a landing page where I added a background video. This video is hosted on vimeo platform.
Video autoplay is completely working on all devices except iPhone mobile. So please suggest me the solution to autoplay background video on iPhone mobile.
Please check following iFrame code -
<iframe src="https://player.vimeo.com/video/479105292?autoplay=1&background=1&hd=1&loop=1&title=0&byline=0&portrait=0&muted=1&playsinline=1" frameborder="0" data-fullscreeneo="" frameborder="0"allow="autoplay; fullscreen" fullscreen webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

How to focus the controls of a YouTube iframe with postMessage

I'm in way over my head on this one.
The goal is to be able to hit spacebar for play/pause, and f for fullscreen when the page loads.
I'm loading the YouTube embed like this:
<script src="https://www.youtube.com/iframe_api"></script>
<iframe
id="player"
frameborder="0"
allowfullscreen="1"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
width="1280"
height="720"
src="https://www.youtube.com/embed/<?php echo $video_id; ?>?autoplay=1&modestbranding=1&iv_load_policy=3&enablejsapi=1">
</iframe>
The question is, can I focus the iframe controls using postMessage? Or any other method?
If so which element in the iframe do I need to focus to be able to get it done? I think it's html5-video-container > video.
Don't think I even need the YouTube jsapi, but it's there for now.
I've been over this SO question about a dozen times and many others, as well.

You can't do it because you cannot insert the javascript required for postMessage to work into youtube's iframe.
Yes, I see that you created the iframe yourself on your page, but that's not how it works.

Autoplay video embed

I have one issue about autoplay video in html. I just write a index.html file and embed a Youtube video into it. I know how to play video automatically by add "?autoplay=1" in link source but when I open this file the first time, my video dont autoplay. Then, I refresh page and it play automatically
<iframe width="560" height="315" src="https://www.youtube.com/embed/M_ueZ9E2g_c?autoplay=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style="margin-top: 30px;"></iframe>
So, my question is Why does it not play automatically in the first time and how to solve it? Thanks very much