Getting Started

Introduction

HTML5 Video Player is a responsive, no-code video player for WordPress powered by Plyr. Embed self-hosted MP4, WebM, and OGG files, YouTube and Vimeo links, video from connected cloud storage, and adaptive HLS or MPEG-DASH streams, then brand every control to match your site.

Upgrading? What’s New in 2.14.0 lists the Audio Player block, the new Style tab, and the settings that no longer get dropped when a site moves from Free to Pro.

What You Get

• Any source: Media Library files, direct URLs, YouTube, Vimeo, cloud storage, and live streams.
• Audio too: an Audio Player block with eight skins and waveforms, plus album playlists (Pro). New in 2.14.0.
• Every editor: Gutenberg blocks, a Classic metabox editor, shortcodes, PHP templates, and an Elementor widget.
• Full control of the player: 16 control buttons, 7 skins, brand color, aspect ratio, and playback rules.
• Engagement features: popup player, watermark, branding overlay, end screen, chapters, and email capture. (Pro)
• Access control: password protection and role-based visibility per video. (Pro)
• Measurement: a built-in analytics dashboard and GA4 event tracking. (Pro)

Free vs Pro at a Glance

Requirements

How These Docs Are Organized

There are two things to understand: where you build a player and where you display it. Most settings are identical either way.

• What’s New in 2.14.0 summarizes the upcoming release, which adds the audio block and repairs the Free to Pro upgrade.
• Creating Players covers the two player editors, how to choose between them, and presets.
• Video Sources and Player Setup document one source or option panel per page.
• Features has one page per Pro feature, matching the tabs in the player editor.
• Quick Player is a separate path: one inline shortcode, no saved player.
• Usage holds the shortcode reference, editors and page builders, analytics, and global settings.

Saved players are stored as posts of the videoplayer post type, playlists as h5vpplaylist, and captured emails as h5vp_submited_email. Every saved player is embedded with the same shortcode: [html5_video id='123'].

What's New in 2.14.0

Version 2.14.0 adds an Audio Player block, gathers the sizing options into a new Style tab, and repairs several settings that were being dropped when a site upgraded from Free to Pro.

New: Audio Player Block

A block called HTML5 Audio Player (html5-player/audio) now sits alongside the video blocks in the Media category. It plays a single file or a whole album, in one of eight skins, with an optional real waveform. The block and three of its skins are free; the remaining five skins and the album playlist need (Pro).

• Eight skins: Modern Bar, Waveform, and Compact Pill in the free plugin, plus Podcast Card, Vinyl Record, Hero Cover Card, Studio Deck, and Vertical Card with (Pro).
• Audio playlists (Pro): multiple tracks with three queue layouts, track numbers, thumbnails, and autoplay-next.
• Track details: title, artist or podcast host, and cover artwork, per track.
• Your own styling: width, border radius, background, and text color.

See the Audio Player group for the full documentation.

New: A Style Tab in the Classic Editor

The Classic metabox editor gains a twelfth tab, Style, holding Player Width, the new Alignment control, and Round Corner. Player Width moved here from the Settings tab, so sizing and shape now live in one place.

New Fields

Fixed: Settings Lost When Upgrading from Free

Several settings created under the free plugin were being ignored once a site upgraded to Pro. All of these now carry over, and none of them need the player re-saving:

• Round Corner was ignored for players built in the free plugin, which always rendered square corners. The saved value is now honored.
• Alignment was dropped. Stored values are now normalized to left, center, right, wide, or full, and applied.
• Subtitles set in the free plugin were invisible to Pro. Pro now reads the old single-caption fields, and a one-time migration copies them into the current subtitle list.
• Inline iOS playback was hardcoded on. It now follows the new per-player field.
• Playback speeds were global only. A player can now carry its own list.

See Upgrading from Free for what to check after an upgrade.

Fixed: Free and Pro Both Active

A guard meant to stop the block class being declared twice never fired, so running the free and Pro plugins together could crash the site with a fatal error. The guard is now correct, though you should still keep only the Pro plugin active.

Also Fixed

• Poster images: an internal value was hardcoded empty, which quietly disabled part of the poster handling. Posters now apply and re-apply reliably.
• Skin control grouping: the code that groups the center controls now looks only inside the control bar, so skins lay out correctly on pages with other player markup.
• PHP 8.1 notices: a [video_player] shortcode with no id, sitting on a page next to a shortcode that has one, no longer triggers deprecation notices.

Installation & Activation

Install the free version from the WordPress plugin directory, or upload the Pro ZIP from your bPlugins account and connect your license.

Install from the WordPress Dashboard

1. Log in to your WordPress admin dashboard.

2. Go to Plugins → Add New.

3. Search for “HTML5 Video Player”.

4. Find the plugin by bPlugins and click Install Now.

5. Click Activate when the installation finishes.

Install by Uploading a ZIP

1. Download the latest HTML5 Video Player Pro ZIP from your bPlugins account.

2. Go to Plugins → Add New → Upload Plugin.

3. Click Choose File, select the ZIP, and click Install Now.

4. Click Activate Plugin when the upload completes.

After Activation

A new Html5 Video Player menu appears in the admin sidebar, and a one-time welcome screen offers to set your preferred editor. The menu items you see depend on your license:

Activating a Pro License

Pro is licensed through Freemius. After activating the Pro build, enter your license key when prompted, or open Html5 Video Player → Demo & Help and activate it there. A 7-day trial is also available. Pro panels unlock as soon as the license is connected.

Quick Start: Your First Player

Create a player, copy its shortcode, and put it on a page. Four steps, about two minutes.

Step 1 – Pick Your Editor (First Run Only)

On first activation the plugin asks whether you prefer the Classic metabox editor or the Gutenberg block editor. Either choice produces the same player and the same shortcode, so pick whichever feels familiar. You can change it later under Settings.

Step 2 – Create the Player

1. Go to Html5 Video Player → Add New Player.

2. Give the player a descriptive title.

3. In the Media tab or panel, keep the source set to Library or CDN and click Add Video to upload or select an MP4 file.

4. Optional: set a Video Thumbnail so visitors see a poster before playback.

5. Adjust Auto Play, Muted, or Repeat if you need them.

6. Click Publish or Save.

Step 3 – Copy the Shortcode

Once saved, the player gets an ID and a shortcode box appears with a copy button:

[html5_video id='123']

Step 4 – Place It on a Page

1. Edit any post, page, or widget area.

2. Paste the shortcode where the video should appear.

3. Update the page and view it on the front end.

You will see a responsive player with your chosen controls. Click play to confirm playback, then resize the window to watch it adapt.

Where to Go Next

• Not sure which editor to use? See Choosing Your Editor.
• Using YouTube, S3, or a live stream? Start in Video Source Types.
• Want one inline shortcode instead of a saved player? See Quick Player.