Dustin Lammiman

<p>A video plugin for WordPress built on the Video.js HTML5 video player library. Allows you to embed video in your post or page using HTML5 with Flash fallback support for non-HTML5 browsers.</p>
<p>View <a href="http://videojs.com" rel="nofollow ugc">videojs.com</a> for additional information.</p>
<h3>Video Shortcode Options</h3>
<h3>mp4</h3>
<p>The location of the h.264/MP4 source for the video.</p>
<pre><code>[videojs mp4="http://video-js.zencoder.com/oceans-clip.mp4"]
</code></pre>
<h3>ogg</h3>
<p>The location of the Theora/Ogg source for the video.</p>
<pre><code>[videojs ogg="http://video-js.zencoder.com/oceans-clip.ogg"]
</code></pre>
<h3>webm</h3>
<p>The location of the VP8/WebM source for the video.</p>
<pre><code>[videojs webm="http://video-js.zencoder.com/oceans-clip.webm"]
</code></pre>
<h3>youtube</h3>
<p>The location of the YouTube source for the video.</p>
<pre><code>[videojs youtube="http://www.youtube.com/watch?v=DJU6ppZAaec"]
</code></pre>
<h3>poster</h3>
<p>The location of the poster frame for the video.</p>
<pre><code>[videojs poster="http://video-js.zencoder.com/oceans-clip.png"]
</code></pre>
<h3>width</h3>
<p>The width of the video.</p>
<pre><code>[videojs width="640"]
</code></pre>
<h3>height</h3>
<p>The height of the video.</p>
<pre><code>[videojs height="264"]
</code></pre>
<h3>preload</h3>
<p>Start loading the video as soon as possible, before the user clicks play.<br />
Use ‘auto’, ‘metadata’, or ‘none’. Auto will preload when the browser or device allows it. Metadata will load only the meta data of the video.</p>
<pre><code>[videojs preload="auto"]
</code></pre>
<h3>autoplay</h3>
<p>Start playing the video as soon as it’s ready. Use ‘true’ or ‘false’.</p>
<pre><code>[videojs autoplay="true"]
</code></pre>
<h3>loop</h3>
<p>Causes the video to start over as soon as it ends. Use ‘true’ or ‘false’.</p>
<pre><code>[videojs loop="true"]
</code></pre>
<h3>controls</h3>
<p>Use ‘false’ to hide the player controls.</p>
<pre><code>[videojs controls="false"]
</code></pre>
<h3>muted</h3>
<p>Use ‘true’ to initially mute video.</p>
<pre><code>[videojs muted="true"]
</code></pre>
<h3>id</h3>
<p>Add a custom ID to your video player.</p>
<pre><code>[videojs id="movie-id"]
</code></pre>
<h3>class</h3>
<p>Add a custom class to your player. Use full for floating the video player using ‘alignleft’ or ‘alignright’.</p>
<pre><code>[videojs class="alignright"]
</code></pre>
<h3>Tracks</h3>
<p>Text Tracks are a function of HTML5 video for providing time triggered text to the viewer. To use tracks use the [track] shortcode inside of the [video] shortcode. You can set values for the kind, src, srclang, label, and default attributes. More information is available in the <a href="http://videojs.com/docs/tracks/" rel="nofollow ugc">Video.js Documentation</a>.</p>
<pre><code>[videojs][track kind="captions" src="http://video-js.zencoder.com/oceans-captions.vtt" srclang="en" label="English" default="true"][/videojs]
</code></pre>
<h3>All Attributes Example</h3>
<pre><code>[videojs mp4="http://video-js.zencoder.com/oceans-clip.mp4" ogg="http://video-js.zencoder.com/oceans-clip.ogg" webm="http://video-js.zencoder.com/oceans-clip.webm" poster="http://video-js.zencoder.com/oceans-clip.png" preload="auto" autoplay="true" width="640" height="264" id="movie-id" class="alignleft" controls="false" muted="true"][track kind="captions" src="http://example.com/path/to/captions.vtt" srclang="en" label="English" default="true"][/videojs]<h3>Video.js Settings Screen</h3>--------------------------
</code></pre>
<p>The values set here will be the default values for all videos, unless you specify differently in the shortcode. Uncheck “Use CDN hosted version?” if you want to use a self-hosted copy of Video.js instead of the CDN hosted version. <em>Using the CDN hosted version is preferable in most situations.</em></p>
<p>If you are using a responsive WordPress theme, you may want to check the <em>Responsive Video</em> checkbox.</p>
<p>Uncheck the <em>Use the [video] shortcode?</em> option <strong>only</strong> if you are using WordPress 3.6+ and wish to use the [video] tag for MediaElement.js. You will still be able to use the [videojs] tag to embed videos using Video.js.</p>


Video.js – HTML5 Video Player for WordPress

Self-hosted responsive HTML5 video for WordPress, built on the widely used Video.js HTML5 video player. Embed video in your post or page using HTML5.

codepeople

<p>CP Media Player – Audio and Video Player features:</p>
<p>♪ Publish Audio and Video players anywhere<br />
♪ Support for audio and video files: MP4, OGG, WebM, MP3, M4A, WAV<br />
♪ Support WebSRT subtitle files<br />
♪ Allow playlist<br />
♪ Allow downloading<br />
♪ Supported most popular browsers: Edge, Firefox, Chrome, Safari, Opera, Brave, IE…<br />
♪ Supported by mobile devices: iPhone, iPad, and Android devices</p>
<p><strong>CP Media Player – Audio and Video Player</strong> allows playing multiple file formats: MP4, OGG, WebM, MP3, WAV, and loading WebSRT subtitle files. <strong>CP Media Player – Audio and Video Player</strong> is based on MediaElement.js, supporting all browsers that implement the HTML5 standard.</p>
<blockquote>
<p>To make the players responsive, essential in mobile devices, enter the player’s width in percentage, Ex. 100%</p>
</blockquote>
<p><strong>Other Features</strong></p>
<ul>
<li>Allows publishing audio and video players anywhere(posts, pages, or directly on template files).</li>
<li>Support popular audio and video files: MP4, M4A, OGG, WebM, MP3, WAV,  and WebSRT subtitle files.</li>
<li>Includes <strong>several skins</strong> with the audio and video player.</li>
<li>Supports most browsers on the web: Edge, Firefox, Chrome, Safari, Opera, Brave, IE, etc. As well as mobile devices such as iPhone, iPad, and Android.</li>
</ul>
<blockquote>
<p>The plugin allows you to associate directories to the players to generate playlists with the contained media files (use “/” to load all media files in the “Uploads” directory and subdirectories).</p>
</blockquote>
<p><strong>Premium Features</strong></p>
<p><a href="https://cpmediaplayer.dwbooster.com/download" rel="nofollow ugc">Premium features</a> are available in the pro version to extend the capabilities of the plugin:</p>
<ul>
<li>Allows <a href="https://cpmediaplayer.dwbooster.com/documentation#protecting-audio-files" rel="nofollow ugc">protecting the audio files</a>. If FFmpeg is installed on the server, the plugin allows you to protect the audio files by embedding a watermark audio layer and generating truncated copies of files for demos.</li>
<li>Allows <a href="https://cpmediaplayer.dwbooster.com/documentation#paypal-integration" rel="nofollow ugc">selling files</a> from the player. It uses PayPal as the payment gateway. Payments are SCA ready (Strong Customer Authentication), compatible with the new Payment services (PSD 2) – Directive (EU)</li>
<li>Includes sales reports.</li>
</ul>
<p>The plugin includes the integration with the following editors:</p>
<ul>
<li>Gutenberg Editor.</li>
<li>Classic WordPress Editor.</li>
<li>Elementor.</li>
</ul>
<p>For other editors, insert the player’s shortcodes into general-purpose blocks orm modules, like text or HTML.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/YJSkEdkDJM8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p><strong>Demo of Premium Version of Plugin</strong></p>
<p><a href="https://demos.dwbooster.com/audio-and-video/wp-login.php" title="Click to access the Administration Area demo" rel="nofollow ugc">https://demos.dwbooster.com/audio-and-video/wp-login.php</a></p>
<p><a href="https://demos.dwbooster.com/audio-and-video/" title="Click to access the Public Page" rel="nofollow ugc">https://demos.dwbooster.com/audio-and-video/</a></p>
<p>Additional details about the “CP Media Player – Audio and Video Player” plugin by visiting its website:</p>
<p><a href="https://cpmediaplayer.dwbooster.com" title="Audio and Video Player" rel="nofollow ugc">https://cpmediaplayer.dwbooster.com</a></p>
<h3>Using the Music and Video Player</h3>
<p><strong>Generating the players directly on the pages and posts</strong></p>
<p><strong>Audio players</strong></p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/YJSkEdkDJM8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p><strong>Video Player</strong></p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/QG5gGBnVqB0?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p>It is possible to generate the player by coding entering the player and items shortcodes into the page’s content:</p>
<pre><code>[cpm-player skin="ball-skin" width="100%" playlist="true" type="audio"]
[cpm-item file="http://www.wp.local/wp-content/uploads/2018/11/1.mp3"]Audio 1[/cpm-item]
[cpm-item file="http://www.wp.local/wp-content/uploads/2018/11/2.mp3"]Audio 2[/cpm-item]
[cpm-item file="http://www.wp.local/wp-content/uploads/2018/11/3.mp3"]Audio 3[/cpm-item]
[/cpm-player]
</code></pre>
<p>To generate the player loading the audio files from the “/wp-content/uploads/2020” directory:</p>
<pre><code>[cpm-player skin="ball-skin" width="100%" playlist="true" type="audio" dir="2020" /]
</code></pre>
<p>The player can load the audio files indicating the directory only. It allows you to add new files to the directory or delete the existing ones, and the player will update the playlist dynamically.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/O-IAv4Ij-_0?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p>The complete list of attributes supported by the shortcodes is available on the <a href="http://cpmediaplayer.dwbooster.com/documentation#cpm-player-attributes" title="The attributes supported by the shortcodes" rel="nofollow ugc">documentation page of the plugin</a>.</p>
<p><strong>Generating the audio and video players from the players gallery</strong></p>
<blockquote>
<p>To make the players responsive, essential in mobile devices, enter the player’s width in percentage, Ex. 100%</p>
</blockquote>
<p>Configure the players from the gallery allows you to insert the same player on multiple websites’ pages or posts.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/WS449LCClA8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p>The detailed description of the players’ settings is available in the following link: <a href="http://cpmediaplayer.dwbooster.com/documentation#creating-players-through-players-gallery" title="Creating the players through the players' gallery" rel="nofollow ugc">Creating the players through the players’ gallery</a></p>
<p>The <a href="https://cpmediaplayer.dwbooster.com/download" rel="nofollow ugc">premium version of <strong>CP Media Player – Audio and Video Player</strong></a> allows you to sell files from the players. <a href="http://cpmediaplayer.dwbooster.com/documentation#paypal-integration" title="Configuring the integration with PayPal" rel="nofollow ugc">Configuring the integration with PayPal</a>.</p>
<p><strong>Other recommended plugins</strong></p>
<ul>
<li><a href="https://wordpress.org/plugins/music-player-for-woocommerce/" title="Music Player for WooCommerce" rel="ugc">Music Player for WooCommerce</a></li>
<li><a href="https://wordpress.org/plugins/music-player-for-easy-digital-downloads/" title="Music Player for Easy Digital Downloads" rel="ugc">Music Player for Easy Digital Downloads</a></li>
</ul>


CP Media Player – Audio Player and Video Player

CP Media Player - Audio and Video Player supported by major browsers, such as IE, Firefox, Opera, Safari, Chrome, and mobile devices: iPhone, iPad, An …

Video.js – HTML5 Video Player for WordPress vs CP Media Player – Audio Player and Video Player