--- title: "How to Embed a Video on a Webpage" description: "When you think about embedding video on the pages of your website, you might see yourself copying and pasting long strings of spaghetti code from one page to another. And, once you've posted the..." url: https://www.inmotionhosting.com/support/website/embedding-video-directly-into-webpage/ date: 2011-09-02 modified: 2023-10-12 author: "Brad Markle" categories: ["Website"] type: post lang: en --- # How to Embed a Video on a Webpage When you think about embedding video on the pages of your website, you might see yourself copying and pasting long strings of spaghetti code from one page to another. And, once you’ve posted the code, you’re seeing strange errors going off. Don’t worry, embedding video on your webpage is not like this at all. It’s actually quite simple. With today’s broadband Internet speeds on both desktop and mobile devices, video streaming is more popular and faster than ever. For this reason, and many more, it makes sense to embed video on your webpage. Put it this way, if you’re *not* using video then your website may get left behind. ## Hosting Options for Video Embedding When it comes to embedding videos on your website, the way you choose to host them has a significant impact on control, customization, and performance. Let’s explore some important considerations: ### Self-Hosted Videos Putting your videos on your own server gives you complete control over the video player’s look and the user experience. This is especially beneficial for businesses looking to maintain a consistent brand identity on their websites. Hosting videos on [dedicated servers](https://www.inmotionhosting.com/dedicated-servers) or [bare metal servers](https://www.inmotionhosting.com/bare-metal-servers) is preferable to shared hosting for several reasons. Firstly, dedicated servers ensure better performance as they provide exclusive resources for your website or application. This exclusivity means that the server’s resources are not shared among multiple users, resulting in smoother video playback and improved overall performance. Additionally, dedicated and bare metal servers offer greater customization options, allowing you to tailor the server environment to meet specific video hosting requirements, implement streaming protocols, and enhance the viewer experience. ### Third-Party Services Opting to host videos on a third-party service rather than self-hosting provides several benefits. Third-party platforms like YouTube, Vimeo, or AWS offer specialized infrastructure designed for efficient video storage, delivery, and playback. One of the primary advantages is the broader reach and visibility that these platforms provide. YouTube, for instance, has a vast user base, potentially increasing the discoverability of your videos. Additionally, third-party services handle the complexities of video encoding, transcoding, and delivery, saving you the effort of managing these technical aspects. In this tutorial, we’ll show you how to embed video from the following services: - [YouTube](#youtube) (free) - [The Internet archive](#internet-archive) (free) - [Amazon Web Services (AWS)](#AWS) (paid) Also, if you’re [embedding video into WordPress](#WordPress), it’s even easier to embed videos from third-party service. All you’ll need is the URL of the video. ## How to Embed Video from YouTube YouTube makes it very simple to embed videos. All you need to do is find your video and click the “Share” button to get to the embed code. 1. Go to YouTube to get your video 2. how_to_embed_video_-01.png[![](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-01.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-01.png)Click the **Share** button Well done! You now have the raw embed code on your website, and the video will render just as it did in the YouTube preview window. ## Embed Video From YouTube to WordPress (Easiest Way) Before we move on to the other video hosting services, we’ll stop and take a look at how the above process works much faster and easier if you’re using WordPress. With WordPress, you don’t need to get your embed code from YouTube. You can actually just copy and paste the video URL itself. A YouTube video URL may look something like this `https://www.youtube.com/watch?v=LRcrgXQjdG0` or this: `https://youtu.be/LRcrgXQjdG0` Both of the above URLs will work the same. 1. Log into your [WordPress dashboard](/support/edu/wordpress/logging-into-wordpress-dashboard/) 2. how_to_embed_video_-04.png [![Edit Post in WordPress dashboard](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-04.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-04.png)Create a new post or edit an existing one 3. how_to_embed_video_-05.png [![paste URL in post](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-05.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-05.png)Paste the URL into the post body (main content area) You’ll notice the URL is instantly replaced by the video. Easy. ## How to Embed Video from the Internet Archive The Internet archive is a hybrid media and preservation repository, where users may submit as much content as they want. Here, you can upload your own videos and embed them on your website. Or, you can embed content uploaded by others. 1. Go to the [Internet archive home page](https://archive.org/) 2. Search for or select a video 3. how_to_embed_video_-06.png [![Internet archive share button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-06.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-06.png)Click the share button 4. Paste the embed into your site Now, the video will render on your page with the all the video controls necessary to play properly. ## How to Embed Video from Amazon Web Services (AWS) As mentioned above, hosting your own video on a dedicated server is best. But if a dedicated server is out of your budget, you can make use of Amazon’s infrastructure to host your videos. Basically, using AWS, we’re going to create an S3 bucket that acts as a sort hard drive in the cloud where we can store our videos publicly. ### Create an S3 Bucket For Storing Video 1. how_to_embed_video_-07.png [![Amazon AWS login screen](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-07.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-07.png)[Log into AWS](https://console.aws.amazon.com/) using your Amazon account 2. how_to_embed_video_-08.png [![Services dropdown](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-08.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-08.png)Click the **Services** dropdown 3. how_to_embed_video_-09.png [![S3 link under Storage](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-09.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-09.png)Under *Storage* click **S3** 4. how_to_embed_video_-10.png [![Blue Create Bucket button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-10.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-10.png)Click **Create bucket** 5. how_to_embed_video_-11.png [![Bucket name and region settings](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-11.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-11.png)Name your bucket and select a region 6. how_to_embed_video_-12.png[![Blue Next button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-12.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-12.png)Click **Next** to select default configure options 7. how_to_embed_video_-22.png[![Block all public access checkbox](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-22.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-22.png)Uncheck *Block all public access* and click **Next** 8. how_to_embed_video_-13.png[![blue Create Bucket button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-13.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-13.png)Click **Create Bucket** after going through options 9. how_to_embed_video_-14.png[![Select bucket](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-14.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-14.png)Select your new bucket to add contents 10. [![blue Upload button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-15.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-15.png)Click **Upload** to upload a video 11. [![Add files popup](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-16.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-16.png)Drag video files into window or click **Add files** to select the video from your computer 12. how_to_embed_video_-17.png[![blue Upload button](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-17.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-17.png)Click **Upload** on the upload screen 13. how_to_embed_video_-18.png [![select video](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-18.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-18.png)Select the video after the upload completes 14. how_to_embed_video_-19.png [![permissions tab](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-19.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-19.png)Select **Permissions** tab from the top 15. how_to_embed_video_-20.png [![Everyone group](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-20.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-20.png)Scroll down to the public access section and click the radio button for “Everyone” 16. how_to_embed_video_-21.png[![Read object checkbox](https://www.inmotionhosting.com/support/wp-content/uploads/2019/06/how_to_embed_video_-21.png)](/support/wp-content/uploads/2019/06/how_to_embed_video_-21.png)Check the box for *Read object* and click **Save** Congratulations! You just uploaded your video and made it publicly available to the web through AWS. In the section below, we’re going to use the object URL to embed the video on a page of your website. ### Use HTML5 Video Tag to Embed the Video The HTML5 standard introduced a new video tag to allow developers to easily drop a video into any HTML page. First, make sure to grab the URL for your video by click the “Object URL” link in AWS. In order to use the video tag, use a code snippet like this instead of the embed codes we used earlier: ` ` That’s it! That’s all you need to know to embed videos on your webpages. Be sure to leave a comment below if you have any trouble with these steps.