前言介紹
- 這款 WordPress 外掛「Video.js HLS Player」是 2016-11-21 上架。 目前已經下架不再更新，不建議安裝使用。
- 目前有 700 個安裝啟用數。
- 上一次更新是 2016-11-25，距離現在已有 3081 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
- 外掛最低要求 WordPress 4.2 以上版本才可以安裝。
- 有 4 人給過評分。
- 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。
外掛協作開發者
star2dev |
外掛標籤
hls | flash | HTML5 | video | wpvideo |
內容簡介
Video.js HLS Player 是一個易於使用的外掛，可以使用此定制的 video.js 播放器將響應式/流體（或固定寬度）HLS 影片輕鬆嵌入 WordPress 文章和頁面中。嵌入外部 .m3u8 HLS 影片檔案不能再簡單不過了。
Video.js HLS Player 功能
將 HLS 影片封裝嵌入文章/頁面或 WordPress 網站上的任何位置
為搜覽行動設備模式優化，嵌入響應式影片提供更好的用戶體驗
嵌入與所有主要瀏覽器兼容的 HTML5 影片
嵌入影片海報圖像
使用 videojs 播放器嵌入影片
在頁面呈現時自動播放影片
在捷徑內使用直接鏈接上傳到 WordPress 媒體庫的備用影片
無需安裝，安裝即可開始嵌入影片
與 WordPress 的最新版本輕量級兼容
無標誌的清爽播放器
其他 HTML5 支援檔案類型（MP4、WebM、Ogv）的後備方案
Video.js HLS Player 外掛使用方式
為了嵌入影片，創建一個新的文章/頁面，並使用以下捷徑：
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8"]
此處，「url」是 HLS 影片封裝檔案所在的位置。
影片捷徑選項
以下選項支援捷徑。
MP4
您可以在源 HLS 影片檔案之外指定 MP4 影片檔案。此參數為可選項。
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" mp4="http://example.com/wp-content/uploads/videos/myvid.mp4"]
WebM
您可以在源 HLS 影片檔案之外指定 WebM 影片檔案。此參數為可選項。
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" webm="http://example.com/wp-content/uploads/videos/myvid.webm"]
Ogv
您可以在源 HLS 影片檔案之外指定 Ogv 影片檔案。此參數為可選項。
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" ogv="http://example.com/wp-content/uploads/videos/myvid.ogv"]
寬度
定義影片檔案的寬度（高度自動計算）。除非您想限制影片的最大寬度，否則不需要此選項。
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" width="480"]
預載
指定影片在頁面載入時如何載入（如果需要）。預設為「自動」（載入整個影片），其他選項：
「metadata」- 在頁面載入時僅載入元數據
「none」- 不在頁面載入時載入影片
[videojs_hls url=”https://player.vimeo.com/external/xxxxxxxxx.m3u8″ preload=”metadata”]
控制
指示是否要顯示影片控制。預設為「true」。若要隱藏控制，請將此参数設置為「false」。
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" controls="false"]
當您關閉控制時，用戶將無法與您的影片互動。建議您啟用無控制影片的自動播放。
自動播放
原文外掛簡介
Video.js HLS Player is a user-friendly plugin that allows you to easily embed responsive/fluid (or fixed width) HLS videos into WordPress posts and pages using this customized video.js player. Embedding externally hosted .m3u8 HLS video files couldn’t be easier.
Video.js HLS Player Features
Embed HLS video package into a post/page or anywhere on your WordPress site
Embed responsive videos for a better user experience while viewing from a mobile device
Embed HTML5 videos which are compatible with all major browsers
Embed videos with poster images
Embed videos using videojs player
Automatically play a video when the page is rendered
Embed fallback videos uploaded to your WordPress media library using direct links in the shortcode
No setup required, simply install and start embedding videos
Lightweight and compatible with the latest version of WordPress
Clean and sleek player with no watermark
Fallback for other HTML5-supported filetypes (MP4, WebM, Ogv)
Video.js HLS Player Plugin Usage
In order to embed a video create a new post/page and use the following shortcode:
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8"]
Here, “url” is the location of the HLS video package file.
Video Shortcode Options
The following options are supported in the shortcode.
MP4
You can specify an MP4 video file in addition to the source HLS video file. This parameter is optional.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" mp4="http://example.com/wp-content/uploads/videos/myvid.mp4"]
WebM
You can specify a WebM video file in addition to the source HLS video file. This parameter is optional.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" webm="http://example.com/wp-content/uploads/videos/myvid.webm"]
Ogv
You can specify a Ogv video file in addition to the source HLS video file. This parameter is optional.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" ogv="http://example.com/wp-content/uploads/videos/myvid.ogv"]
Width
Defines the width of the video file (Height is automatically calculated). This option is not required unless you want to limit the maximum width of the video.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" width="480"]
Preload
Specifies if and how the video should be loaded when the page loads. Defaults to “auto” (the video should be loaded entirely when the page loads). Other options:
“metadata” – only metadata should be loaded when the page loads
“none” – the video should not be loaded when the page loads
[videojs_hls url=”https://player.vimeo.com/external/xxxxxxxxx.m3u8″ preload=”metadata”]
Controls
Specifies if video controls should be displayed. Defaults to “true”. In order to hide controls set this parameter to “false”.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" controls="false"]
When you disable controls users will not be able to interact with your videos. So It is recommended that you enable autoplay for a video with no controls.
Autoplay
Causes the video file to automatically play when the page loads.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" autoplay="true"]
Poster
Defines image to show as placeholder before the video plays.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" poster="http://example.com/wp-content/uploads/poster.jpg"]
Loop
Causes the video file to loop to beginning when finished and automatically continue playing.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" loop="true"]
Muted
Specifies that the audio output of the video should be muted.
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" muted="true"]
iOS Inline
Force the video to play inline on iOS 10+
[videojs_hls url="https://player.vimeo.com/external/xxxxxxxxx.m3u8" inline="true"]
For detailed documentation please visit the Video.js HLS Player plugin page
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Video.js HLS Player」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
延伸相關外掛（你可能也想知道）
Easy Video Player 》Easy Video Player 是一個易於使用的 WordPress 影片外掛程式，可展示您的影片。您可以嵌入自行架設的影片或使用直接連結外部架設的影片。, Easy Video Playe...。
MediaElement.js – HTML5 Video & Audio Player 》此外掛為 WordPress 設計的影音控制元件，是建立在 MediaElement.js HTML5 播放器程式庫之上，並為不支援 HTML5 的瀏覽器提供 Flash 或 Silverlight 候補播放...。
Videojs HTML5 Player 》Video.js HTML5 Player 是一個支持桌面和移動裝置視頻播放的用戶友好的外掛。它讓你輕鬆嵌入自主託管的視頻文件或使用 Video.js 庫的外掛視頻文件。, , Video...。
Video.js – HTML5 Video Player for WordPress 》, , 這是一個基於 Video.js HTML5 播放器庫所建立的 WordPress 外掛。它能夠讓您使用 HTML5 在文章或頁面中嵌入影片，並提供 Flash 回退支援非 HTML5 瀏覽器...。
WordPress Mobile Pack – Mobile Plugin for Progressive Web Apps & Hybrid Mobile Apps 》WordPress Mobile Pack 是一款能協助你將網站內容轉換為漸進式行動網路應用程式的 WordPress 外掛。它附帶多種行動應用主題，可單獨購買或作為一個套件購買。...。
Gravity Forms – Placeholders add-on 》將 Gravity Forms 外掛的 HTML5 placeholder 功能強化，將欄位標籤複製為 placeholder 並隱藏之。對於不支援 HTML5 placeholder 屬性的舊版瀏覽器，使用 Java...。
Video Player for WPBakery 》Video Player for WPBakery 是 WPBakery Page Builder 的一個外掛程式，可以讓您在 WordPress 網站中添加 YouTube、Vimeo 和自行托管的視頻（HTML5）。, 功能...。
mb.YTPlayer for background videos 》這是一個無框架的YouTube®視訊播放器，可讓您將任何YouTube®視訊作為Wordpress®網頁或文章的背景播放。, 您可以從設置面板啟用首頁播放（不需要許可證），或...。
Cincopa video and media plug-in 》無需多個 WordPress 外掛來管理您的媒體，Cincopa 是您所有媒體需求中唯一需要的外掛。使用 Cincopa 輕鬆地添加視頻、照片庫、幻燈片、音樂和播放列表等等。...。
PB oEmbed HTML5 Audio – with Cache Support 》這個外掛使用 WordPress 用於其他用途（例如YouTube視頻等）的 oEmbed 技術，為文章和頁面添加了放置音頻文件的功能。音頻文件使用 HTML5 音頻標籤嵌入，對於...。
Modernizr for WordPress 》這個外掛可以在你的WordPress安裝中加入 Modernizr。, Modernizr是一個小型JavaScript函式庫，用來檢測下一代網頁技術中的原生實作可用性，也就是來自HTML5和...。
Gravity Forms HTML5 Validation 》此外掛為Gravity Forms外掛新增原生HTML5驗證支援。, 支援標準與分頁表單。, 支援標準欄位, , 單行文字, 段落文字, 下拉式清單, 多選清單, 核取方塊, 數字, ...。
Flowplayer Video Player 》Flowplayer 影片播放器可在您的 WordPress 網站上添加一個影片短碼。使用此短碼，您可以嵌入一個影片檔案，並使用 Flowplayer HTML5 播放器進行播放。, 特點,...。
Bradmax Player 》Bradmax Player 是一個 WordPress 外掛，支援桌面及行動裝置上的影片串流播放。只要您具有以下格式的影片串流存取權限：, – HLS, – MPEG-DASH, &...。
Radio Forge Muses Player with Skins 》RadioForge Players 可在瀏覽器中提供本機音頻播放。它支援所有的瀏覽器，包括 iOS、Android、Firefox、Chrome、Safari、IE 和 Opera。, RadioForge Players ...。