Home » Tutorials » How to embed video onto your WordPress website

How to embed video onto your WordPress website

|

We all know that video is the next big thing now that Facebook live, Instagram stories, and the like have taken off.  But how about putting videos into your blog posts or to introduce a new product?  This is a great use of video and one that we are beginning to see more and more of, so let’s answer the question of how to embed your own videos onto your own site so you can jump on this bandwagon!

Storing your videos

The first order of business is to discuss where to upload your videos. While you can upload videos directly to your WordPress media library, this is not the best way to store your videos.  Video files are quite heavy files and over time they can potentially begin to dramatically slow your site down, which we don’t want.

In comes third party services like YouTube, Vimeo, or Wistia.  These companies specialize in video and have an infrastructure to handle all the video storage you could possibly need as you grow. That said, I recommend choosing one of these third party services to upload your videos and then you can embed the videos directly to your site from there.

Accessing your embed code

YouTube

  • Upload your video to YouTube
  • Navigate to your videos page – example link
  • Click the Share icon below your videos title name
  • Click the Embed tab at the top
  • You’ll immediately see the code that you can copy, but if you’d like more options you can click the See More button at the bottom to check off/on options or adjust the size of the video
  • Copy the embed code that is provided and scroll down a bit in this post to find out where to paste it

In order to embed videos from Youtube, you’ll want to be sure your video is set to public.  If you’re looking for an option to keep your videos private but still embed, move down to Vimeo or Wistia which are both capable of this.

Vimeo

  • Upload your video to Vimeo
  • Navigate to your videos page – example link
  • Click the Share icon below your videos title name
  • You’ll see a popup appear where you’ll see the option with the embed code
  • You can then click the show options button and you’ll be given more options to turn off/on and edit the size of the video.
  • Copy the embed code that is provided and scroll down a bit in this post to find out where to paste it

Making your videos private

  • Click the settings icon under your video
  • Select the Privacy tab
  • Configure options as needed

Here is a screenshot of how I typically configure mine:

We personally use Vimeo the most for hosting our videos because I like the way they appear on sites from a design perspective.  I also do keep most of my videos private so they are only able to be viewed from our website.

Wistia

  • Upload your video to Wistia
  • Navigate to your videos individual page
  • Click the Video Actions blue button in the top right of the screen
  • Select Embed & Share
  • You’ll get a popup that you can adjust settings in
  • Copy the embed code that is provided and scroll down a bit in this post to find out where to paste it

Embed video onto your website

  • Navigate to your WordPress dashboard and edit a page or post that you’d like to embed your video
  • Once on the editor page, be sure that the HTML (text) tab is selected at the top right of your editor and NOT the Visual tab.
  • Scroll within your page/post to where you’d like to place your video and paste your code in
  • You can now switch back to the Visual tab and your video will remain

Similar Posts

6 Comments

  1. OMG, perfect timing! 🙂 I just uploaded a video on my blog, but it came out small. Apparently I forgot what I was doing (done better previously), so your post came at a good time!
    I love all your email posts – so helpful!
    Thank you.

  2. Perfect timing! I had previously uploaded video’s on my site, but couldn’t figure it out again. Old lady user error. LOL
    So your email post came at just the right time, as usual…
    I appreciate and enjoy getting your posts.
    Thank you

  3. Is there a way to get a video to autoplay? I embedded a video (in a text widget) to show on my homepage, but it just shows a black screen with a “play” button. This is an introduction video, and I’d love for it to autoplay (with sound being optional.)
    Thanks so much!
    Ashley
    (website is set to “coming soon” so it won’t show for you)

    1. Hi Ashley,
      Is the video stored in the media folder? Or in a 3rd party app such as YouTube, Vimeo, etc.?

Leave a Reply

Your email address will not be published. Required fields are marked *