336: How to embed video content in a WordPress site

When working with video content for your WordPress site, you have two options, uploading and embedding. You can learn the differences between the two in our article on Embedding vs Uploading Videos. This guide walks you through the process of embedding video content directly from a third party video site such as YouTube or Vimeo.

Getting the Embed code

Getting the code form YouTube

  1. Upload a video to, or select a video from, your YouTube account.
  2. click share on youtube video

    In our sample case, we decided to use a video of a puppy. Once you have located your video of choice, find the Share link and click it.

  3. copy embed code

    A small section of content will appear under the Share link. There is an option named Embed for you to click. The code for embedding the video into a website will appear. It is pre-highlithed, so all you need to do is copy it to paste into your WordPress post or page.

Getting the code from Vimeo

  1. Select a video, or upload one to your Vimeo account.
  2. click on share

    We chose a puppy video from the Vimeo archives. Once you have decided on your video, locate the Share link on the right hand side of the screen and click it.

  3. select embed code

    A popup will appear and you will be able to highlight and copy the embed code for use in your site.

Embedding video content to your WordPress site

  1. Log into your WordPress admin dashboard.
  2. Click on the post/page you want to edit, or click on Add New to add a new one. We elected to edit the existing Hello World post.
  3. update the post

    Once in the post or page editor, you will want to be sure you are on the Text mode, which is a tab in the right hand corner of the editor. Paste the embed code into the post or page wherever you want it to appear.

  4. Click the Update button to save the changes, then visit your site to see the embedded video on your WordPress page. Below is a before and after of how a video can enhance your site for your visitors.
    Before After
    before image is embedded in a post

    after an image is embedded in a post

Leave a Reply