Wpbakery video player autoplay

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.

How to Embed a Video in the WordPress Block Editor

The easiest way to embed a video in the WordPress block editor is to add a Video block.

Wpbakery video player autoplay

You can then choose to Upload a video file, pick one from your media library, or add one with a URL. If you wish to embed an existing video from the WordPress media library choose Media Library, select the video and click Insert.

Wpbakery video player autoplay

How to Autoplay a Video in the WordPress Block Editor

Once the video is embedded in the WordPress block editor, you can simply select the block and enable Autoplay under Video settings.

Wpbakery video player autoplay

How to Loop a Video in the WordPress Block Editor

Once the video is embedded in the WordPress block editor, you can simply select the block and enable Loop under Video settings.

How to Mute a Video in the WordPress Block Editor

Once the video is embedded in the WordPress block editor, you can simply select the block and enable Muted under Video settings.

How to Hide Video Player Controls in the WordPress Block Editor

Video player controls are shown by default in WordPress. You can choose to hide these controls by selecting the video block and disabling Playback controls under Video settings.

How to Play a Video Inline in the WordPress Block Editor

playsinline is an attribute that tells mobile browsers to play the video right where it is instead of opening it up fullscreen. You can choose to apply playsinline to a video in WordPress by selecting the block and enabling Play inline under Video settings.

How to Add Preload to a Video in the WordPress Block Editor

Once the video is embedded in the WordPress block editor, you can customize the Preload attribute by selecting the block and choosing Metadata, Auto or None under Video settings.

How to Add a Poster Image to a Video in the WordPress Block Editor

Once the video is embedded in the WordPress block editor, you can simply select the block and click Select under Poster image to either upload a new poster image or use an existing one from the media library.

How to Embed a Video in the WordPress Classic Editor

The easiest way to embed a video in the WordPress classic editor is to copy and paste its URL into your post/page editor.

http://example.com/wp-content/uploads/myvideo.mp4

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 amanaged WordPress hostingenvironment. If you wish to embed a video in lightboxyou will need to use the Lightbox Ultimate plugin.

Insert from Media Library (Classic Editor)

While you are writing content in the classic visual editor, you can click on the Add Media button to upload and insert a video into the post/page.

Wpbakery video player autoplay

Once the video is embedded, you will be able to see a preview of the thumbnail even before publishing it.

Wpbakery video player autoplay

How to Embed a Video Using the WordPress Video Shortcode

WordPress core comes with a video shortcode that can be used to manually embed a video. In order to embed a video using this method in the WordPress block editor, you need to add a Shortcode block.

Wpbakery video player autoplay

Once the shortcode block is added, you can embed a video by inserting this shortcode.

[video src="https://example.com/wp-content/uploads/myvideo.mp4"]

Wpbakery video player autoplay

In the WordPress classic editor you can directly insert the shortcode.

WordPress Video Shortcode Options

Embeddinga video by using the video block or directly pasting the URLis easier. But if you use the video shortcode you will have more customization options.

Currently, the video shortcode supports the following options.

src

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).

[video src="https://example.com/wp-content/uploads/myvideo.mp4"]

You can specify otherfile formatsto allow for graceful fallbacks.

  • mp4
  • m4v
  • webm
  • ogv
  • wmv
  • flv

[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

poster attribute defines an image to show as a placeholder before the videoplays.

[video src="https://example.com/wp-content/uploads/myvideo.mp4" poster="http://example.com/wp-content/uploads/poster.jpg"]

loop

loop attribute allows for the looping of a video. If set to on the video will start over again every timeit is finished.

[video src="https://example.com/wp-content/uploads/myvideo.mp4" loop="on"]

autoplay

autoplay attribute causes the videoto automatically play as soon as it is ready.

[video src="https://example.com/wp-content/uploads/myvideo.mp4" autoplay="on"]

preload

preload attribute definesif and how the video should be load when the page loads. Default is metadata.

  • metadata only metadata shouldload when the page loads.
  • none the video should notload 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

width attribute defines the width of the video.

[video src="https://example.com/wp-content/uploads/myvideo.mp4" width="640"]

height

height attribute defines the height of the video.

[video src="https://example.com/wp-content/uploads/myvideo.mp4" height="360"]

Its better not to specify awidth 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 alsomake the video responsive.

How to Embed a WMV Video in WordPress

WMV is a Windows Media Video file compressed withMicrosofts video compression formats. This format is normally used in Windows to store videos on your computer. Since WMV is not an HTML5 compatible video format, its not possible to play this type of video file in a modern browser.

If you have a WMV video file that you wish to play on your WordPress site, you should encode it to a supported HTML5 video format instead (e.g. MP4, WebM, and Ogg). You can do this very easily these days with a free video encoder like handbrake.

First, Select the video file on your computer and open it using Handbrake.

Wpbakery video player autoplay

Now select a destination where the encoded video file will be saved. Make sure to keep the Web Optimized option enabled. Click Start Encode.

Wpbakery video player autoplay

You can upload the newly generated video file to your server and embed using the above method.

Disclosure: This page may contain affiliate links. If you follow one of those affiliate links and purchase something it will provide me with a little bit of a commission. This costs you nothing extra but helps maintain my site, free plugins, and themes. So I thank you for your support.

Share this:

  • Twitter
  • Facebook
  • Pinterest

Related