Even if you have plenty to say to your audience, sometimes words alone aren’t enough. In today’s world of hyper-stimulation, you’ve got to compete against a barrage of beeps, boops, and other notifications for every sliver of your audience’s attention. 

That’s where video comes in: Including a well-made video on your website keeps your audience engaged and gives them another way to absorb the story you’re trying to tell. If you’re a creator looking to improve your online presence, here are the best video embedding options to use. 

What is a video embed?

A video embed involves taking a video from YouTube or a video hosting site and putting it straight on your website or a project you’re working on. People can then watch the video right there instead of having to click away to another source. 

Video embeds are done using a special piece of code that the online video platform gives you. It acts as a tiny instruction manual that tells your website how to show the video on your page. 

Say you made an explainer video and published it on YouTube, but you also want to share it on your latest blog post. You’d need to grab an embed code for the video and place it in the draft post. Once you hit publish, the video will be watchable on the live page.  

How to embed videos on your website: 4 different options

How to embed videos in HTML

Already have a particular video you’d like to appear on your page? Great! Whether it’s an existing video or an original clip, you can add any video content to your page by embedding it via a string of HTML code, like the following:

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Here's a breakdown:

• <video>: This is the HTML tag used to embed video content. It creates a video player on the webpage.
• width="320": Sets the width of the video player to 320 pixels.
• height="240": Sets the height of the video player to 240 pixels.
• controls: This attribute is added to provide play, pause, and volume controls to the viewer.

Inside the <video> tag, there are <source> tags used to specify the video files to be played:

• <source src="movie.mp4" type="video/mp4">: This line specifies the source of the video file. The src attribute defines the path to the video file, and the type attribute specifies the MIME type of the video, which in this case is video/mp4.
• <source src="movie.ogg" type="video/ogg">: Similar to the first <source> tag, but this one specifies an OGG video file as an alternative source. The browser will try to play the first source it supports, so if it doesn't support MP4, it will try to play the OGG file.
• Your browser does not support the video tag: If all else fails, this text will appear to tell the viewer that they should probably update their ancient web browser. 

If you’re really good with HTML, you can add CSS to style your video player by adding box shadows, rounding corners, or autocentering. 

But you don’t need to understand all this code to embed a video. It’s much easier to get an embed code from a platform like YouTube, Vimeo, or Descript.

All you have to do is copy the embed code from your video hosting platform and place it on your page wherever you’d like it  to be displayed. In some cases, your embed code may be a long string of unwieldy HTML, but most hosting sites will generate short, easy-to-use embed codes that can be easily placed within the copy on your page. The process varies slightly from site to site, which we’ll get into below.

How to embed videos on a WordPress website

Videos can be easily embedded in the ever-popular CMS WordPress either by embed code or, if hosting on common sites like YouTube and Vimeo, by URL alone.

• For URL embeds, copy and paste your URL directly where you’d like the video to populate in the text box. That will result in the standard display version of your video, but an embed code can allow you to tweak that display.
• To use an embed code, you’ll need to be in WordPress’s Text Editor, as opposed to the Visual Editor, and paste in the code. From there, you should be able to toggle back to the visual editor or the draft and see the image on the page as intended.

Another option is using a WordPress plugin like WonderPlugin Video Embed to add videos from various sources, improve load times, and customize the look of your video player. 

How to embed videos on a Squarespace website

Embedding your video in Squarespace is as simple as copying either the video’s URL or the embed code from its host site and pasting it into the block where you’d like the video to appear.

If your video is hosted on YouTube, Wistia, Vimeo, or Animoto, all you’ll need to do is paste the URL. Using these hosting platforms will give you additional options as to how your video will be displayed on the page. For any other hosting sites, you’ll need to paste the embed code in the block. To do this, click on the block where you’d like the video to appear and paste the embed code, then save your changes.

Once you’ve successfully embedded the video, you can modify the thumbnail by adding a title or additional text, selecting a thumbnail image, or uploading an entirely new thumbnail image.  

How to embed videos on a Wix website

Wix users can embed videos using either the video’s URL or embed code. If embedding via URL, you click the plus sign to the left of the editor, and choose Video from the list of options. From there, you’ll select your host platform from the Single Video Players; YouTube, Vimeo, or Facebook. 

Using an embed code instead of the URL of the video will give you more options to customize the display. The procedure is similar to embedding a URL, but after clicking the plus sign to the left of the Edit options, you choose More, and then, under Embeds, click to add an HTML frame. Wix also allows you to host your video directly by uploading it to Wix Video.

Where to find embed codes 

Most hosting sites generate embed codes to make video sharing on your website a breeze. Here’s where to find embed codes across a variety of different video hosting platforms.

Embed codes on Descript

To get an embed code for the video you made in Descript, you’ll first need to publish a page. Here’s how it works:

Step 1: Click the Publish button at the top-right corner of your editor window. 

Step 2: Open the Publish tab.

Step 3: Select Web link from the dropdown menu.

Step 4: Set your title, resolution(video-only), access permissions, and other settings.

Step 5: Select Publish.

Click the link icon at the top of the share page, then click Copy link, which will automatically copy the video link URL to your clipboard for easy pasting.

If you’d like to copy the embed code directly to the HTML of your website, click the Copy code button, then paste it into your website. You’ve now successfully embedded your video.

Embed codes on YouTube

To find your video’s embed code on YouTube, click on the Share button. This will bring up the Share box with clickable icons to share across WhatsApp, Twitter, and other platforms. 

However, the first option in the lineup is the Embed icon. Click that, and you’ll see the embed code to copy-paste.

Embed codes on Instagram

When embedding a video from Instagram, you’ll need to be logged in from your computer and not your phone. Go to the post you’d like to embed and click the ellipsis in the upper right corner. 

A drop-down box will appear with the options to Go to post, Share, Copy link, Embed, and Cancel. From there, you’ll have the choice of including the post’s original caption or embedding it without the caption.

Embed codes on X (formerly Twitter)

As with Instagram, you’ll need to be on your computer when embedding from Twitter and not using the app. Find the tweet you want to embed and click on the ellipsis in the upper right corner. This will bring you to a page where you can choose between embedded video and embedded post.

Clicking your choice will open a new window with the embed code featured at the top along with a Copy Code button. You can also choose to adjust the language and width you’d prefer for the video in the customization options. 

Embed codes on TikTok

To embed a TikTok video, you’ll need to be logged in to your account on your computer. Click on the video you want to embed and look for the Share icons to the right of the page. 

Click the embed icon followed by the Copy code button on the pop-up box. Unlike other platforms, TikTok doesn’t give you any options to make tweaks to the video’s appearance or adjust start times.

Embed codes on Vimeo

Vimeo’s embed code can be found by clicking the Share icon to the right of the video player. The embed code will appear above the player along with player options below. 

Here you can adjust the size of the player, autoplay settings, text placement, and more. If you have a Business, Pro, or Premium account, you’ll have access to additional settings such as color adjustments and business logo placements.

7 ways to use video to enhance your website

Video can work just about anywhere on your website. It really comes down to the types of videos you want to make and the viewing experience you’re trying to deliver online. Here are some common types of videos to consider.

1. Introductory videos. The homepage is your first chance to wow your audience, and a well-made introductory video can go a long way. This is your big chance to tell the viewer where you’re coming from, what you stand for, and what you can do for them.
2. Demo videos for goods and services. You can write paragraph after paragraph explaining what you can offer potential customers but it’s rarely as effective as just showing them via a well-made demo video.
3. Informational videos. Once you’ve successfully lured the user to your landing page, what do you want them to do next? You may want them to buy your latest product, tease an upcoming project, or provide more information about whatever it is you’ve been working on. A video explainer here can help keep an already-interested audience engaged long-term.
4. Personal or company profile video. Who are you? Your site visitors want to know more about your values and beliefs, and a quick video is an excellent way to tell them.
5. Blog videos. Blogs are a content catch-all and video can serve to reinforce whatever story you’re hoping to tell. That can include personal news and updates, how-to guides, reaction videos, and more.
6. Customer spotlight videos. Let your happy customers do the talking! Just as a demo video can show off the real-life applications of your product, a customer profile video is an excellent way to show what your user base has to say about your product and tell other potential customers how they’ve benefited from your goods or services.
7. Support portal videos. A support video or how-to clip is a smart way to answer common questions about how your product works and provide your customers with step-by-step guidance to resolve any recurrent issues.

Key benefits of embedding video on your website

As with most things in life, keeping it simple is generally the best way to go. So why not cut out the middleman and upload your videos straight to your site? 

Well, hosting those videos isn’t as simple as it sounds. It can cause your page to load very slowly, which not only makes for a terrible user experience but can also tank your SEO rankings. Here’s why embedding is typically your best bet:

• Faster page loading and increased SEO rankings. Loading speed plays a huge role in determining where your site falls in terms of ranking on search engines like Google. Embedded videos load much more quickly and provide a seamless experience to your viewers.
• Prevents bandwidth issues. Hosting a video on your site can eat up your server’s bandwidth, and the problem only gets worse when others link or embed your videos on their own sites. You can easily avoid this by embedding your videos on a third-party platform like YouTube or Vimeo. These companies build their product around hosting and embedding video, and know how to do it well.
• Bypass storage limitations. Videos take up a lot of storage space, something that’s limited and expensive. That can result in slow page performance and poor video playback. Video embedding puts the burden of storage on your host site instead.
• Embedded video looks better. As a result of storage limits, video often must be compressed at the expense of quality. Embedded videos have fewer restrictions and can support high-definition formats, which gives your viewers a higher-quality experience.

What to look for in a video player

Embeddable video players can vary greatly in terms of functionality and features. For example, some let you make basic aesthetic tweaks like adjusting the frames around the player, or even have a say in the kind of related videos that play after yours. 

Here are some features to look for when choosing a video player for your embedded videos, all of which are available in Descript’s embedded video player.

• Titles and captions. A title card makes for a great introduction to your video. Most players let you insert text over your videos which can then be positioned as a title or end credits. More advanced players will have captioning capabilities, which can help make your content more accessible.
• Layering and transitions. The ability to layer audio, video, images, and GIFs and even create seamless transitions can add serious polish to your finished video. With layering, you can layer voices to achieve multiple effects or simply layer your company logo over video.  
• Transcripts. Transcripts are an ideal feature for how-to videos and educational content, plus they’re a great way to reinforce your video's message. Descript’s latest transcript feature now allows you to share specific moments from the video by simply highlighting that text in the transcript and copy-pasting. That’ll take you to the exact timestamp for each snippet of the transcript. For longer videos, that makes it easier to call out just the highlights to your audience.

‎Tips for embedding videos on a website 

From higher engagement and increases in dwell time, video can benefit your site in a number of ways. But that doesn’t mean you can plop down just any old video clip with little to no effort. At least not if you expect to see positive results. 

We asked video expert Jean Merlain at Wistia—a hosting platform that provides companies with on-site video for marketing, support, and sales—for his insights on adding video to your website. Here are his tips.

Choose an attention-grabbing thumbnail

“Thumbnails are very important for your videos, and knowing which one to use has a huge impact in getting your viewer to hit play. It’s the first impression [your audience has] of your video, which is why you should consider the impact your thumbnail will have on capturing your viewer’s attention. One of the best ways to capture your audience’s attention is to give your videos a visual boost with a text overlay or a looping video thumbnail when applicable.” 

“That would allow for your videos to get more plays compared to traditional, static images. If your video has people in it, we recommend that the frame you choose for your thumbnail is one with your talent’s face visible to drive more engagement, specifically a higher play rate.”

Pay attention to page placement

“Though it varies by content type and your audience, when embedding videos on your webpage, the higher you can place the video, the better. If you’re trying to optimize for play rate and engagement, you want to consider placing your video above the fold for the largest impact.”

Aim for the right length

“From our State of Video Report, we’ve found that the sweet spot for an ideal video length is somewhere between 3–5 minutes where your audience is engaging with videos on average 47% of the time. It does vary based on the type of videos you’re creating and the audience consuming those videos. For videos between 5–30 minutes long, we do see an engagement average of 38%.”

Don’t forget accessibility

“When uploading and publishing video, some of the things you want to consider are accessibility and captions. Accessibility is an important but often overlooked part of the video production and hosting process—but it doesn’t have to be. Enabling captions for your videos will help make your content more accessible to a wider audience.”

Design everything

“You’ll also want to consider customizing your player color to be high contrast as well as an on-brand color. You’d be surprised, but our customers most commonly use neutral colors like black, white, and shades of gray for their video player.”

The easiest way to embed videos on websites

Descript offers a complete solution for editing, managing and embedding video content on your website and beyond. You can upload, edit, and embed videos with a full-featured video player that includes searchable transcripts, timestamped comments, and user permissions. 

With Descript, embedding videos is not just about sharing content; it's about creating an interactive and engaging experience for viewers anywhere on the web.

Join thousands of other creators using Descript to create, edit, and share video content. Sign up for a free account today. 

Embedding videos FAQ

Can you embed a video from a URL?

Yes, you can embed a video from a URL. The majority of content management systems (CMS) like WordPress, social media platforms, and website builders let you embed videos directly from URLs, especially YouTube and Vimeo.

How do I turn a video into an embed?

Turning a video into an embed depends on the video hosting service you’re using. For example, with YouTube, you just need to go to the YouTube video and copy the embed code. With Descript, you can publish a standalone webpage, grab the embed code, and place it on your website. 

What is iframe used for?

An iframe (Inline Frame) is an HTML element used to embed webpages, videos, maps, and other types of interactive content directly into a webpage.