指南/建立內容/媒體/自訂 VideoPress 播放器

自訂 VideoPress 播放器

你可以自訂 VideoPress 播放器,以符合網站的設計並控制影片的呈現方式。在這份指引中,你將學到如何調整播放器大小、設定自訂海報圖片、啟用或停用播放功能,以及個人化進度列。

影片教學課程

此影片使用英文字幕。
YouTube 提供自動翻譯功能,讓你可以用自己的語言觀看:

開啟自動翻譯字幕的方法:

  1. 播放影片。
  2. 點擊影片右下角的 ⚙️ 設定 圖示。
  3. 選擇 字幕/副本
  4. 選擇 自動翻譯
  5. 從清單中選擇你的偏好語言。

使用自動配音(測試版)的方法:

  1. 點擊 ⚙️ 設定 圖示。
  2. 選擇 音訊曲目
  3. 選擇你想收聽的語言:

ℹ️ 翻譯與配音由 Google 自動產生,可能不夠精確,且自動配音功能仍在測試階段,暫未向所有語言開放。

變更播放器大小

若要直接在 WordPress 編輯器中調整 VideoPress 播放器的大小,請依照下列步驟操作:

  1. 按一下「VideoPress 區塊」,即可加以選取。
  2. 檢視影片播放器邊緣或角落的調整大小控點 (小正方形)。
  3. 按一下並拖曳控點,將播放器的寬度或高度調整為偏好的大小。
  4. 放開滑鼠按鈕以設定新大小。
  5. 按一下「儲存」或「發表」,即可套用變更內容。

選擇縮圖

海報圖片是影片播放前顯示的縮圖。你可以從影片中選擇畫格,或上傳自訂圖片。

  1. 選取「VideoPress 區塊」,然後開啟「區塊設定」側邊欄。
    • 如果沒有出現側邊欄,請按一下右上角的「設定」圖示。
  2. 在「海報和預覽」區段下,選擇下列其中一項:
    • 從影片畫格中挑選:捲動影片時間表以選取畫格作為海報圖片。
    • 選取海報圖片:上傳新圖片,或從媒體庫中選取圖片。
  3. 你也可以切換選項以顯示「暫留時的影片預覽」,讓訪客能夠瀏覽影片內容。
  4. 按一下「儲存」或「發表」,即可套用變更內容。
VideoPress 區塊設定側邊欄的海報和預覽選項。

💡

使用至少和影片解析度一樣大的海報圖片,以獲得最佳品質 (例如,1080p 影片使用 1920 x 1080 圖片)。

自訂播放

你可以控制影片的播放方式,以及檢視者可以使用的選項。

  1. 選取「VideoPress 區塊」,然後開啟「區塊設定」側邊欄。
    • 如果沒有出現側邊欄,請按一下右上角的「設定」圖示。
  2. 在「播放」底下,調整下列選項:
    • 自動播放:載入頁面時,自動開始播放影片。
      提醒你,除非將影片設為靜音,否則某些瀏覽器可能會封鎖自動播放。
    • 循環播放:重複播放影片。
    • 設為靜音:關閉音效即可開始播放影片。檢視者可以是需要取消靜音。
    • 顯示控制項:顯示或隱藏播放控制項 (播放、暫停、音量等)。
    • 內嵌播放:允許在行動裝置內嵌播放影片,而不是全螢幕播放。
    • 預先載入:選擇載入頁面時要載入多少影片 (無、中繼資料、自動)。
  3. 按一下「儲存」或「發表」,即可套用變更內容。
VideoPress 區塊設定側邊欄中的播放選項。

變更進度列顏色

你可以個人化進度列的顏色,以更符合影片或網站設計。

  1. 選取「VideoPress 區塊」,然後開啟「區塊樣式」側邊欄。
    • 如果沒有出現側邊欄,請按一下右上角的「設定」圖示。
  2. 動態顏色預設為啟用,這會在影片播放時調整其顏色。
  3. 停用顏色的設定選項:
    • 主要:進度列的預設顏色。
    • 已載入:載入影片後進度列的顏色。
    • 進度:載入影片時進度列的顏色。
  4. 按一下「儲存」或「發表」,即可套用變更內容。

調整邊框間距和邊界

透過區塊樣式側邊欄尺寸設定,調整 VideoPress 播放器四周的邊框間距和邊界。

VideoPress 短代碼

你也可以按照下列步驟,使用短代碼插入影片並控制其大小:

  1. 儀表板中按一下「媒體
  2. 按一下你想要取得短代碼的影片。
  3. 如下圖所示,按一下「複製」按鈕複製提供的短代碼。
    • VideoPress 短代碼會以 [ 符號為開頭,後面接著是 wpvideovideopress、字元字串與結尾 ] 符號。
    • 例如:

[wpvideo YN4MKhAB]

「媒體」中影片詳細資料頁面的底部區段,短代碼會以反白顯示。
  1. 編輯要在其中顯示此影片的文章或頁面。
  2. 按一下「+ 區塊插入工具」,新增短代碼區塊。
  3. 貼上第 3 步的短代碼,然後在結束括號前方新增 w=XXX 指定寬度 (以像素為單位),如下所示:

[wpvideo YN4MKhAB w=400]

只要影片寬度符合佈景主題文章欄的寬度,你就可以將影片寬度設為較大或較小的大小。

VideoPress 短代碼屬性

短代碼可以接受下列屬性來修改預設行為:

  • 寬度 (以像素為單位) 的 w=X,不得包含單位。
  • 高度 (以像素為單位) 的 h=Y,不得包含單位。
  • hd=true/false,強制 HD 播放。
  • freedom=true/false,強制僅使用開放原始碼影片格式。
  • autoplay=true/false,在載入時自動播放影片。
  • loop=true/false,自動重複播放影片。
  • controls=false,隱藏在顯示影片時的預設影片控制項。

你可以使用想要的屬性,方法是在結尾 ] 符號前新增那些屬性:[wpvideo OcobLTqC attribute=value]。例如:

[wpvideo OcobLTqC w=640 h=400 autoplay=true loop=true]

Copied to clipboard!