使用 Webflow 的視頻功能動態整合視頻

視訊字段是一個集合字段,可讓您在設計和模板頁面中動態插入視訊。

視訊功能是 收藏 該功能使您能夠將第三方平台(例如 YouTube 或 Vimeo)上託管的影片包含在 CMS 中。您可以在收藏清單和收藏頁面上展示這些影片。影片功能也可用於細化集合清單或為集合清單和頁面中的元素建立條件可見性。

視訊功能的一些典型應用
  • 登陸頁的宣傳影片
  • 產品概述視頻
  • 資源頁面的教學和教程視頻
探索過程
  1. 啟動視訊功能
  2. 將影片合併到影片功能中
  3. 將視頻功能連結到視頻
  4. 透過影片功能過濾收藏列表
  5. 使用視訊功能配置條件可見性

開始影片功能

您可以將視訊功能引入新的或現有的集合。在集合設定中,選擇 新功能 然後選擇 影片 特徵。

與任何其他功能類似,您可以選擇定義該功能是否是強制性的。

將影片合併到影片功能中

影片功能接受 Vimeo 和 YouTube 等第三方影片平台的影片 URL。

 

視訊功能針對所有裝置進行了最佳化,消除了您和您的協作者對行動響應能力的擔憂。

您和您的協作者可以透過富文本欄位在「集合」頁面上包含更多影片內容。

將視頻功能連結到視頻

  1. 在集合清單或集合頁面上包含影片元素
  2. 啟用設定 從以下位置獲取視頻 checkbox 在 影片設定 選單
  3. 將其與相關視訊功能相關聯 功能下拉式選單
 

您可以透過選擇文字元素並點擊畫布上元素標籤旁邊的設定圖示或導航至「設定」面板 (D) 來存取「影片設定」。

您可以透過取消選取“來斷開關聯”從“獲取視頻” 檢查kbox下 視訊設定。

使用視訊功能檢索燈箱的媒體內容

  1. 將燈箱新增至收藏清單或收藏頁面
  2. 在燈箱設定中,從影片功能擷取媒體

透過影片功能過濾收藏列表

在某些情況下,您可能會選擇專門展示具有配置的影片功能的收藏項目的收藏清單。一個典型的例子是創建視訊庫時。為了達成這個:

  1. 選擇集合清單進行篩選
  2. 導航至 設定面板 (D)
  3. 介紹一個 篩選 在下面 收藏清單設置
  4. 在初始下拉清單中選擇相關視訊功能
  5. 選擇 已設定 在第二個字段中
  6. 點選 節省

與視訊功能一起使用的可用過濾器標準有:

  • 已設定 – 標識具有為此視訊功能配置的影片 URL 的集合項目
  • 未設定 – 定位沒有為此連結功能設定影片 URL 的集合項目

了解有關過濾集合列表的更多信息.

使用視訊功能配置條件可見性

同樣,您可以對集合清單或頁面中的影片元素建立條件可見性規則。這可確保僅當為特定集合項目配置影片連結時影片元素才可見。

  1. 選擇連結到影片功能的影片元素
  2. 訪問 設定面板 (D)
  3. 介紹一個 狀態 (使該元素可見)下 有條件的可見性
  4. 在初始下拉清單中選擇您的影片功能
  5. 選擇 已設定 在第二個下拉清單中
  6. 點選 節省

了解有關條件可見性的更多資訊。

麥伊凡
Ewan Mak 的最新帖子 (看全部)