Uploading Video & Adding the Video Player

Use the video block to upload an MP4 and insert a video player.

Related tutorials

Embedding Content from Other Websites

Embedding Video from YouTube

The simplest way to insert a video is to embed it from YouTube or Vimeo. Because an embedded video isn’t uploaded to your website, it doesn’t slow page load times. It also takes advantage of the reach and usability of a larger platform like YouTube.

In some cases, though, uploading video to your site is the smarter way to go. Maybe you have a short clip for demonstration purposes, like the video of a medical device in a news story. In this case, the video is brief, and it doesn’t stand on its own or do any storytelling.

Remember the transcript!

If you’re inserting a video that has audio, it’s best to also include closed captions or a transcript. This makes the content accessible to people with hearing loss or who don’t have audio set up on their device. Since a transcript is text-based, it also makes the content searchable by Google and other search engines.

How to use the video block

New to building pages in blocks? Get to know the block editor »

  1. Save the video as an MP4. Filename should be keyword-rich and directory-friendly (e.g. inserting-video.mp4)
  2. Add a video block, and select Upload, or Media Library if you’ve already uploaded it.

    With the Insert from URL option, the video block can be used to embed videos from YouTube or Vimeo; however, this isn’t the only way to insert a video from another website. Other blocks — including paragraph, embed, YouTube and Vimeo — support embedding content from other sites. If you enter a URL and WordPress recognizes the source, it automatically switches to the appropriate block.l remain in place on the page when played. The user could still select fullscreen from the video player buttons, though.

Videos uploaded directly to your site should be:

  • 20 seconds max
  • 32MB max
  • Reliant on the page for context (e.g. demos, examples)
  • A poor fit for YouTube or Vimeo (making a video unlisted is another good option in such a case)
  1. To float the video left or right with text wrapping around it, change the alignment in the top toolbar block settings. The alignment may not display properly in the editor, so preview the page to test how it looks.
  2. Add a caption to describe the video and/or attribute a source.
  3. Keep most or all of the video settings at their default. You’ll find these settings in the right panel:
    1. Keep autoplay and loop disabled for accessibility best practice.
    2. Play inline is a mobile-only setting. If turned off, a video will automatically go fullscreen when played on a mobile device. If toggled on, a video will remain in place on the page when played. The user could still select fullscreen from the video player buttons, though.
    3. Leave playback control on if you want people to be able to watch and rewatch the video (seems important, right?).
    4. Set a different cover image by uploading an still frame as the poster image. This image should be the same aspect ratio as the video.