How to embed YouTube Shorts


This post goes over to how to embed a YouTube Short using an iframe.

Video ID

Copy the video ID from the URL. For example, the video ID is abc123 for the link below:

https://youtube.com/shorts/abc123

Also, make sure to copy the ID between the last / and ?:

https://youtube.com/shorts/abc123?si=def456

Embed

Now replace <VIDEO_ID> with the video ID:

<iframe
  width="360"
  height="640"
  src="https://www.youtube.com/embed/<VIDEO_ID>"
  title="YouTube Short"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  referrerpolicy="strict-origin-when-cross-origin"
  allowfullscreen
></iframe>

For a bigger 16:9 player, you can replace the width and height with 405×720 or 450×800. For example:

 <iframe
-  width="360"
-  height="640"
+  width="450"
+  height="800"
   src="https://www.youtube.com/embed/<VIDEO_ID>"
   title="YouTube Short"
   frameborder="0"
   allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
   referrerpolicy="strict-origin-when-cross-origin"
   allowfullscreen
 ></iframe>

If you want to center the video player horizontally, then add the attribute style="display: block; margin: 0 auto;":

 <iframe
   width="360"
   height="640"
+  style="display: block; margin: 0 auto;"
   src="https://www.youtube.com/embed/<VIDEO_ID>"
   title="YouTube Short"
   frameborder="0"
   allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
   referrerpolicy="strict-origin-when-cross-origin"
   allowfullscreen
 ></iframe>

Demo

Here’s an example of an embedded YouTube Short:

<iframe
  width="405"
  height="720"
  style="display: block; margin: 0 auto;"
  src="https://www.youtube.com/embed/chYGYjH2E2c"
  title="YouTube Short"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  referrerpolicy="strict-origin-when-cross-origin"
  allowfullscreen
></iframe>


Please support this site and join our Discord!