The core WordPress has a video embed feature which allows you to embed a video in WordPress very easily. This video embed feature was included in WordPress 3.6 which made it easier for you to embed a video in WordPress without having to install a plugin. In this post, I will show you how you can directly embed a remotely hosted video in WordPress or a video that you have uploaded to your WordPress media library.
The easiest way to embed a video in WordPress is to copy and paste it into your post/page editor.
Please note that this option will only work on a self-hosted WordPress site where you can install plugins/themes. So if your website is hosted elsewhere (e.g. wordpress.com), make sure to move to a reliable WordPress hosting environment like SiteGround.
Insert from Media Library
While you are writing content, you can click on the Add Media button to upload and insert a video into the post/page.
Once the video is embedded, you will be able to see a preview of the thumbnail even before publishing it.
Embedding a video by directly pasting the URL is easier. But if you use the video shortcode you will have more customization options. In fact, WordPress automatically creates a video shortcode for you when you insert a video from the media library. You will need to switch to the “text” editor to see the actual shortcode.
Currently, the video shortcode supports the following options.
This is the source of your video file. It is recommended to use mp4 file format since it is compatible with most browsers (including browsers running on mobile devices).
You can specify other file formats to allow for graceful fallbacks.
video mp4="http://example.com/wp-content/uploads/myvideo.mp4" ogv="http://example.com/wp-content/uploads/myvideo.ogv" mov="http://example.com/wp-content/uploads/myvideo.mov"]
“poster” attribute defines an image to show as a placeholder before the video plays.
video src="https://example.com/wp-content/uploads/myvideo.mp4" poster="http://example.com/wp-content/uploads/poster.jpg"]
“loop” attribute allows for the looping of a video. If set to “on” the video will start over again every time it is finished.
video src="https://example.com/wp-content/uploads/myvideo.mp4" loop="on"]
“autoplay” attribute causes the video to automatically play as soon as it is ready.
video src="https://example.com/wp-content/uploads/myvideo.mp4" autoplay="on"]
“preload” attribute defines if and how the video should be load when the page loads. Default is “metadata”.
- metadata – only metadata should load when the page loads.
- none – the video should not load when the page loads.
- auto – the video should load entirely when the page loads.
video src="https://example.com/wp-content/uploads/myvideo.mp4" preload="auto"]
“width” attribute defines the width of the video.
video src="https://example.com/wp-content/uploads/myvideo.mp4" width="640"]
“height” attribute defines the height of the video.
video src="https://example.com/wp-content/uploads/myvideo.mp4" height="360"]
It’s better not to specify a width and height in the shortcode. WordPress will fit the video in the content area with the best possible width and height (keeping the aspect ratio). This will also make the video responsive.