How to Embed Video in a WordPress Website

Spread the love

One way to keep visitors on your website longer is to include interactive elements, such as embedded video. I have experimented with many types of techniques when embedding a video in WordPress. Some turned out well (see my post about SEO secrets), others were pretty rough (you can’t see those because I deleted them). After a lot of trial and error, I finally found the easy way to embed ad-free videos in WordPress. If you are asking yourself, “How do I embed a video into my website?” you’re in the right place. Keep reading, and you will learn all about embedding video in WordPress, here’s your essential guide.

***Disclaimer: This post contains affiliate links, which means I earn from qualifying purchases at no additional cost to you.*** Already know what you’d like to get from Amazon? Here’s a handy way to get to the website, linked to a very hot item with teachers right now, the auto-tracking selfie stick. Just click on the button below, then browse around and do your shopping.

Why are Ad-Free Videos Important?

I’m an elementary school librarian, and I know how easily distracted students can get by ads. In my school district, teachers use YouTube videos, but some parents have intentionally blocked the site, so I needed to find another way. These techniques about embedding video into WordPress will work with YouTube videos, but there are other options out there to explore. Some I’ve used with students include WeVideo and Adobe Spark video. Those are both great free options without ads, and they are very user-friendly. If you would like an easy way for students to be able to add images, music, and effects to a video, those are worth a try. If you are doing a screencast (a video of your own screen) and you are a teacher, Loom Pro is free for teachers and students. For my recipe blog posts, I wanted to find a way to upload my own demonstration videos and share them in a professional-looking way.

Necessary Video Equipment

Lately, I’ve gotten into making videos using my phone and the iMovie app. One of the best products I’ve purchased to help me is a selfie tripod for my phone that comes with a selfie ring light.

When I am cooking, I don’t have a hand free to hold a phone, so I put the phone in the tripod holder and position it for shooting video. My granite kitchen countertops can be slippery, so I use a piece of inexpensive rubberized shelf liner to hold the tripod in place. No one wants a dark video, so the ring light with its different settings creates a light, bright effect.

What if I Already Have a Video and Just Need to Upload It?

Due to my use of the tools in the iMovie app on my phone, I easily did all of the editing in less than 30 minutes. Now I just needed to upload it to a site where I could get an embed code. “How do I embed a video into my website?” I wondered. It turns out, the answer was easier than I could have imagined.

The WordPress Video Embed List

As I was investigating, asking myself, “How do I embed an mp4 in WordPress?” I found something amazing. WordPress itself has a list of whitelisted sites that it allows to embed videos automatically, without having to use any code. All you have to do is paste in the video URL from one of these sites, and your video will be embedded. Wondering “How do I embed a YouTube video in a WordPress blog?” Good news! YouTube is on the whitelist. If you are wondering which video sites are included, here they are (I didn’t include non-video sites):

  • Amazon Kindle Instant Previews
  • Animoto
  • CloudUp
  • DailyMotion
  • Flickr
  • TED
  • TikTok
  • VideoPress
  • Vimeo
  • WordPress.tv
  • YouTube

That’s quite a list! If you are trying to decide what the best video format for WordPress is, getting a sharable link from one of these sites is definitely easy. Paste the link into the text of your WordPress post and you’re done! For the video I used for my caramel corn post, I created a free Vimeo account. Then I uploaded the video to Vimeo, got a shareable link, pasted the link into my post, and got this:

YouTube or Vimeo?

Many people choose to embed YouTube videos, and the process is the same as embedding a Vimeo video. I chose Vimeo because there aren’t any ads to distract the viewer. This can be especially helpful if you are embedding a video in a school website. YouTube videos are sometimes blocked by parents who have noticed their student going down a YouTube rabbit hole when supposedly being in an online class or doing homework. You are limited to just a few videos, this way, though.

How do you Embed a Video That’s not from a WordPress Whitelisted Site?

If you have a video from another site, such as Loom, for example, you can paste the link into an Embed Block. Not using the WordPress Block Editor (Gutenberg)? Just select the Text option at the top of your post, instead of the Visual option. Loom, WeVideo, Adobe Spark and even Google Drive provide embed codes. You can copy and paste the embed code into the Text of your post and it will show up. I have noticed that videos embedded from Google Drive have a lot of black area around the video screen, which lessened the visual appeal, in my humble opinion. The embed code is often provided for you to easily copy and paste.

 

One Drawback of Embedding Video in a Website

Do videos slow down a website? Yes, videos do slow a website’s load time. You might be asking yourself,” How do I optimize my website for video?” or “How do I make videos load faster?” There are a couple of super easy options. You want to look for an image-optimizing plugin and enable the video lazy load feature. The most widely-recommended plugin for this is , because the video lazy load feature is built-in. If you have an image-optimizing plugin like (which is excellent for helping to speed up a website), you will need to add an extra lazy load plugin. Sometimes, if you use more than one image-optimizing plugin, there are compatibility problems.

What Does it Mean to Lazy Load a Video?

When a lazy load feature is enabled, that means the video appears as a static image until the video is activated by the viewer. The video won’t load as a video until the play button is clicked on, for example. The lazy load feature really does improve site speed. I tested my caramel corn post in Google Page Speed Insights before installing the lazy load plugin and after. There was a difference in speed of ten points. I use WP Rocket to speed up my websites, and it includes a lazy load feature.

Going to Try Embedding Some Videos in Your WordPress Site?

I hope this has encouraged you to try embedding some videos into your WordPress website. If you need assistance, please feel free to reach out. I’d really enjoy seeing what you create.

Have fun embedding videos in WordPress!

Signature

Related Posts:

Lisa Mitchell is a school librarian who likes to use her job as an excuse to stay up far too late reading books and noodling around with tech tools.

Like what you read? Please share!

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Skip to content