Able Player, accessible HTML5 media player vs HTML5 Video Player – embed fast, responsive videos with ease

This plug-in uses Able Player, an open-source fully-accessible cross-browser HTML5 media player, to embed audio or video within your WordPress page. Instructions for Use There are currently three ways to add an Able Player instance to a WordPress site: Go to Settings > Able Player > Settings and enable the options to use Able Player for all video, audio, and playlists. Able Player will automatically replace MediaElement.js or the default WordPress video/audio blocks with Able Player. Go to Settings > Able Player > Shortcodes to generate an [ableplayer] shortcode. Enter or paste any valid HTML5 Able Player code into your web page. Full documentation is available on the Able Player project page on GitHub. Using the media rewriting in option #1, Able Player will replace any audio or video block. Any tracks added to that block will be automatically handled, giving you support for all the standard Able Player features: captions, navigable transcripts, subtitles, chapters, and audio description. Using option #2, you can create Able Player shortcodes that support most of the basic Able Player features, with support for Vimeo, YouTube, or local video. Option #3 supports the full scope of Able Player features. The [ableplayer] shortcode The [ableplayer] shortcode supports the following attributes. Required attributes (one of these) youtube-id – 11-character YouTube ID or YouTube URL. vimeo-id – Vimeo ID or URL. media-id – An attachment ID for a media file in your WordPress media library or the URL to a hosted video. Additional Player Content captions – Attachment ID or URL to .vtt captions file. Optional pipe separator for language code and label. subtitles – Attachment ID or URL to .vtt subtitles file. Optional pipe separator for language code and label. chapters – Attachment ID or URL to .vtt chapters file. Optional pipe separator for language code and label. descriptions – Attachment ID or URL to .vtt audio descriptions file. Optional pipe separator for language code and label. youtube-desc-id – YouTube URL or ID of a described version of the video youtube-sign-src – YouTube URL or ID of a sign language interpreted accompanying video vimeo-desc-id – Vimeo URL or ID of a described version of the video All captions, subtitles, chapters, and descriptions tracks must be in .vtt format. The shortcode only supports a single set of values for each type of data; to add multiple tracks of the same type you can use the Video block or add custom HTML. Either an attachment ID or a URL for your track .vtt is required; you can optionally add a language code and a custom label: captions="/path/to/file.vtt|es|Español" By default, the language will be your WordPress installation language, with the labels “Captions”, “Subtitles”, “Chapters” or “Audio Description”. Player Options youtube-nocookie – “true” or “false” (use “true” to embed YouTube untracked, for added privacy) autoplay – “true” or “false” (default is “false”) loop – “true” or “false” (default is “false”) playsinline – “true” or “false” (default is “true”). By setting to “false”, some devices (e.g., iPhones) will play the video in their own media player rather than in Able Player. hidecontrols – “true” or “false” (default is “false”). Set to “true” to enable the player controls to fade away during playback. They will appear again if the user hovers over the player or pressing a key, and they are always accessible to screen reader users. poster – the URL of a poster image, displayed before the user presses Play width – a value in pixels (by default, the player will be sized to fit its container) height – a value in pixels (by default, the height of the player will be in proportion to the width) heading – The HTML heading level (1-6) of the visually hidden “Media Player” heading that precedes the player (for the benefit of screen reader users). If omitted, a heading level will be intelligently assigned based on context. speed – “animals” or “arrows” (default is “animals”) start – start time at which to start playing the media, in seconds. Some browsers do not support this. volume – “0” to “10” (default is “7” to avoid overpowering screen reader audio). Some browsers do not support this. seekinterval – number of seconds to forward/rewind with the Forward and Rewind buttons. If omitted, the interval will be intelligently assigned based on length of the video. nowplaying – “true” or “false” to include a “Selected Track” section within the media player (default is “false”). transcript-div – ID attribute of a target element that will contain the video transcript id – a unique id for the player (if omitted, one will be automatically assigned) Examples Example 1 This example uses HTML to add an audio player to the page, with one source (an MP3 file). html Example 2 This example uses HTML to add a video player to the page, with one source (an MP4 file) and four tracks (for captions, descriptions, and chapters in English; and subtitles in Spanish). html Example 3 This example uses the shortcode to add a video player to the page, with one source (an MP4 file) and four tracks (for captions, descriptions, and chapters in English; and subtitles in Spanish). All sources are fetched as WordPress media attachments. html [ableplayer poster="21" media-id="24" captions="25|en|English" subtitles="26|es|Español" descriptions="27" chapters="28"] Example 4 This example uses a shortcode to add a YouTube player to the page, with two versions of the video, one with audio description and the other without (the user can toggle between the two versions using the D button). [ableplayer youtube-id="XXXXXXXXXXX" youtube-desc-id="YYYYYYYYYYY"] Example 5 This example uses a shortcode to add a Vimeo player to the page, with two versions of the video, one with audio description and the other without (the user can toggle between the two versions using the D button). [ableplayer vimeo-id="XXXXXXXXX" vimeo-desc-id="YYYYYYYYY"] The Able Player plugin was originally created by Terrill Thompson.

Embed beautiful, responsive videos anywhere on your site – no code required, trusted by 30,000+ websites worldwide. HTML5 Video Player | Documentation | Pricing | Support | Demo Why HTML5 Video Player? HTML5 Video Player is a flexible, fully responsive video player plugin for WordPress. Embed MP4 and other video formats with ease, customize the player to match your site design, and enjoy smooth playback across all major browsers and devices. Add players to posts, pages, or widgets using shortcodes or the Gutenberg block – no code needed. Built-in options let you control video behavior such as autoplay, loop, mute, and more, while schema markup helps search engines understand and index your videos. Free Features Responsive HTML5 Video Player: Seamlessly adapts to all devices and screen sizes. No-Code Embedding: Use shortcodes to quickly add videos anywhere on your site. Cross-Browser Compatibility: Works perfectly on Chrome, Firefox, Safari, and more. iOS & Mobile Friendly: Plays video files on all major devices without extra plugins. Autoplay, Loop & Mute Options: Customize how your videos behave. Preload Options: Choose how much of the video loads up front (metadata, auto, none) to balance speed and bandwidth. Inline iOS Playback: Play videos inline on iOS devices instead of forcing fullscreen. Skins & Color Customization: Style the player to match your brand. Supports Multiple Formats: Embed MP4, WebM, OGG, and MOV files. Preview for Paid Content: Great for selling digital video files with previews. Lightweight & Compact: Doesn’t take up unnecessary space on your page. Custom CSS Support: Fine-tune your player with custom styles. SEO Optimized: Schema markup helps search engines understand and index your videos. Video Playlist Block: Build a playlist of videos with a simple list layout, auto-play next with a 5-second “Up Next” countdown, custom thumbnails, and duration badges. HLS Streaming: Play .m3u8 adaptive streams, with automatic quality levels. Subtitles & Captions: Add a .vtt caption track to any player, with your own language label. Player Alignment: Align the player left, centre or right from the block editor, the classic metabox, the Quick Player settings, the shortcode or Elementor. Audio Player Block: A skinnable audio player with four skins — Modern Bar, Waveform, Podcast Card and Compact Pill — plus speed, skip, volume and download controls. Pro Version The Pro version adds more flexibility and advanced controls for managing video playback and customization: Color Picker: Change player colors to match your site perfectly. External Hosting Support: Embed videos from Amazon S3 and other sources. Multiple Subtitles Support: Add more than one caption track and let viewers choose the language. Advanced Playlists: Three extra playlist layouts (List With Thumb, List on Right Side, Grid), a live search filter, prev/next arrows, plus a playlist post type and [video_playlist] shortcode. DASH Streaming: Play .mpd adaptive streams alongside HLS. Quality Switcher: Viewers can toggle video quality like on YouTube. Page Load Optimizer: Defer player assets and video loading for better page speed scores. Restart, Rewind, Fast Forward: Full playback control buttons. Download Button Toggle & Custom Download URL: Enable, hide, or redirect video downloads. Customize Every Control: Show/hide any button or control. Speed & Quality Control: Let users adjust playback speed and resolution. Advanced Shortcode Generator: Right inside your post/page text editor. Autoplay When Visible on Screen: Smart autoplay triggers only when the video enters the viewport. Disable Pause: Prevent viewers from pausing the video. Show Thumbnail on Pause & Sticky on Scroll: Keep viewers engaged as they browse. Seek Time & Start Time: Customize jump distance and auto-start position. Google VAST Tag URL: Integrate ad tags using Google VAST for monetization. Chapters & Overlay: Add chapter markers and custom overlays for a better experience. End Screen & Popup Player: Show a custom end screen or open videos in a distraction-free modal. Password Protected Videos: Restrict video access to users with a valid password. Watermark Support: Add branding or copyright with a watermark. Additional ID/CSS Class: Add unique IDs or CSS classes for advanced custom styling. Try the Pro Version – Unlock all premium features today! How to Use HTML5 Video Player – Quick Start Install and activate the plugin. Go to the HTML5 Video Player menu in the WordPress dashboard. Create a new video player and configure your settings. Copy the shortcode displayed for your player. Paste the shortcode into any post, page, or widget. Prefer the block editor? Add the HTML5 Video Player block, select your player, and publish – your video is live! Quick Player shortcode: [video_player src="video src"] More attributes you can use: controls="play-large, restart, rewind, play, fast-forward, progress, current-time, mute, volume, captions, settings, pip, airplay, download, fullscreen" autoplay="true/false" muted="true/false" preload="auto/metadata/none" playsinline="true/false" width="500px" align="left/center/right" caption="https://example.com/subtitles.vtt" caption_label="English/en" reset_on_end="true" Live Demo | Buy The Pro Use Cases Product Demos: Embed demo videos on landing and product pages. Courses & Tutorials: Display video tutorials and course content. Testimonials: Showcase client testimonial videos. Portfolios: Build a video portfolio of your work. Digital Sales: Add previews for paid video content. What Users Say ❛❛We got multiple support from the developer. Outstanding and fabulous! 100 % satisfied and my personal recommendation for video player plugin!❜❜ -newbie2004 ❛❛This guy is the future of WordPress plugins. The interface is the very definition of simplicity and everything just works right out of the box.❜❜ -amallulla Like the plugin? Missing a feature? Send your feedback Check Out Our Other WordPress Plugins Html5 Audio Player – Listen audios with awesome visuals. PDF Poster – Display/Embed PDF files with different styles. StreamCast – Customizable radio player with different skins. 3D Viewer – Embed 3D models and 3D products with interaction. Advanced Post Block – Show posts and custom posts in different layouts. Source Code You can find the source code, report bugs, and contribute to the development of this plugin on our GitHub repository: HTML5 Video Player on GitHub Third-Party Libraries This plugin bundles the following third-party library: Codestar Framework Source: http://codestarframework.com/ GitHub: https://github.com/Codestar/codestar-framework License: GPLv2 or later – https://github.com/Codestar/codestar-framework/blob/master/LICENSE Purpose: Provides the options framework for the plugin’s settings and shortcode generator. Plyr – Version: 3.8.4 – Purpose: Provides the customizable HTML5, YouTube, and Vimeo media player interface used to render videos. – License: MIT – Website: https://plyr.io – Source code: https://github.com/sampotts/plyr – Bundled file: public/js/plyr-v3.8.4.polyfilled.js bpl-tools Source / GitHub: https://github.com/bPlugins/bpl-tools License: GPL-2.0-or-later – https://www.gnu.org/licenses/gpl-2.0.html Purpose: Shared utility library providing admin dashboard components and common Gutenberg editor controls. External Services: The library may connect to bPlugins, WordPress.org, and Freemius services for product data and checkout functionality. See full details: https://github.com/bPlugins/bpl-tools#external-requests–why-they-are-made