YouTube Shorts are vertical, short-form videos designed for mobile viewing — but that doesn’t mean they’re limited to the YouTube app. Many creators and website owners want to embed Shorts directly into their sites to boost visibility, drive engagement, or add fresh content without the need for lengthy production. The good news is: embedding a YouTube Short works almost exactly like embedding a regular video — but with a few small differences worth noting. This guide walks you through the entire process, step by step.
Can You Embed YouTube Shorts Like Regular Videos?
Yes — YouTube Shorts can be embedded just like regular YouTube videos, but there are a few important points to understand before you do.
Technically, Shorts are regular YouTube videos that meet certain criteria (less than 60 seconds, vertical format, and tagged or detected as a Short). Because of this, every Short has its own video page and a unique video ID, just like any other video.
However, here’s what’s different:
- Shorts URLs often redirect to the Shorts player (
youtube.com/shorts/VIDEO_ID
), which is optimized for mobile. - The Shorts player does not support all embed features, like custom start times or full responsive control.
- To embed a Short properly, you need to use the standard video URL format:
https://www.youtube.com/watch?v=VIDEO_ID
— not the Shorts link.
Using the correct URL ensures the embedded player behaves like a normal YouTube video, giving you more control over size, layout, and playback.
How to Embed a YouTube Short on a Website (Step-by-Step)
Embedding a YouTube Short is nearly identical to embedding any YouTube video — as long as you use the right link format. Here’s how to do it:
Step 1: Get the Correct Video URL
- Go to the YouTube Short you want to embed.
- Click the “Share” button below the video.
- In the popup, copy the regular watch link — it should look like:
https://www.youtube.com/watch?v=VIDEO_ID
⚠️ Avoid using the
/shorts/VIDEO_ID
format — it loads a mobile-only player with limited functionality.
Step 2: Generate the Embed Code
- Visit:
https://www.youtube.com/embed/VIDEO_ID
ReplaceVIDEO_ID
with the actual ID from your copied link. - Alternatively, YouTube provides an iframe embed code:
- Right-click the video and select “Copy embed code”
- Or go to the video page → Click “Share” → “Embed”
Example iframe code:
<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe>
Step 3: Insert the Embed Code Into Your Website
- HTML Website: Paste the iframe code directly into your HTML where you want the video to appear.
- CMS Platform (WordPress, etc.): Use a Custom HTML block or embed block and paste the iframe code.
Optional Customizations:
- Change width/height in the iframe to match your layout.
- Autoplay (not always supported): Add
?autoplay=1
to the URL. - Mute (for autoplay): Add
&mute=1
after autoplay. - Responsive design: Wrap the iframe in a div with CSS for responsiveness.
Example:
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
<iframe src="https://www.youtube.com/embed/VIDEO_ID"
style="position:absolute;top:0;left:0;width:100%;height:100%;"
frameborder="0" allowfullscreen></iframe>
</div>
Embedding YouTube Shorts on Popular Platforms
Different website platforms offer different ways to embed YouTube content. Here’s how to embed Shorts correctly on some of the most commonly used site builders:
WordPress
Block Editor (Gutenberg):
- Copy the regular watch link (
https://www.youtube.com/watch?v=VIDEO_ID
). - In your post or page, click the “+” icon to add a new block.
- Select the YouTube block.
- Paste the URL and click Embed.
Classic Editor:
- Just paste the regular YouTube URL directly into the content editor — WordPress auto-generates the embed.
For more control (autoplay, size, etc.), use the Custom HTML block with your iframe code.
Wix
- In your Wix editor, click “Add” → “Embed” → “Embed a Widget”.
- Drag the HTML widget into your page.
- Paste your iframe code inside the widget settings.
- Adjust the size as needed using the editor tools.
Squarespace
- Edit the page where you want the Short.
- Add a “Code” block.
- Paste your iframe embed code.
- Save and refresh the page to preview the embedded Short.
Blogger / HTML Sites
- Open the HTML section of your post or page.
- Paste your YouTube Shorts iframe code where you want it to appear.
- Save and publish.
Note: Avoid using the
/shorts/
format in embeds across all platforms, as it may not display correctly or responsively.
Limitations and Tips
While embedding YouTube Shorts is straightforward, there are some limitations and quirks to be aware of — especially when using the Shorts player or relying on the /shorts/
URL format.
1. Shorts Player Limitations
- If you embed using the
/shorts/VIDEO_ID
link directly, it may open in a vertical mobile-style player with limited controls. - The embedded Shorts player does not support custom start times, autoplay, or mute parameters.
- It may not display properly in some desktop layouts or older site builders.
Tip: Always use the https://www.youtube.com/watch?v=VIDEO_ID
format when embedding.
2. Responsive Layout
- By default, iframe embeds have fixed width and height.
- On mobile devices, this can cause layout issues unless you wrap the iframe in a responsive container.
Tip: Use CSS to make the video scale with screen size (example provided in the previous section).
3. Autoplay and Mute
- Autoplay doesn’t always work across all browsers — especially without mute enabled.
- If you add
?autoplay=1&mute=1
to the iframe URL, it may autoplay correctly in modern browsers, but this behavior is not guaranteed.
4. SEO and Page Speed
- Embedding videos can slightly increase page load times.
- Use lazy loading if your platform supports it.
Tip: Add loading="lazy"
inside the iframe tag to delay loading until the user scrolls to the video.
Example:
<iframe loading="lazy" ...></iframe>
5. Thumbnail Customization
- You can’t customize the thumbnail on an embedded Short unless it’s part of the actual video upload.
- Make sure your Short has a compelling first frame — it becomes the default preview in most embeds.
Conclusion
Embedding YouTube Shorts on your website is not only possible — it’s simple, as long as you use the correct method. Shorts function like regular videos behind the scenes, so you can embed them using the standard YouTube embed code or video URL format. Avoid using the /shorts/
link directly, as it can limit player features and responsiveness.
Whether you’re using WordPress, Wix, Squarespace, or a custom HTML site, the process is nearly identical: grab the correct video link or embed code, paste it into your site, and customize it to fit your layout. With a few adjustments for responsiveness and user experience, you can effectively integrate Shorts into your web content without sacrificing functionality.
Leave a Reply