夾子

Clip 元素使您能夠將託管在 YouTube 或 Vimeo 等第三方平台上的影片整合到您網站上的任何位置。

在本課程中，您將學到：

1. 新增影片的步驟
2. 如何調整視訊配置
3. 建立影片比例
4. 在您的網站上新增剪輯的替代方法
5. 使用個人化代碼合併視頻

整合剪輯

有兩種方法可以將剪輯元素插入您的網站：

• 揭開面紗 插入面板 並拖曳一個 影片 元素到您的 Webflow 畫布上
• 鍵入 命令 + 乙 （在 Mac 上）或 控制 + 乙 （在 Windows 上）打開 快速尋找 並尋求 影片 成分

調整剪輯配置

在畫布上找到剪輯元素後，您可以修改 夾子配置 輸入 URL 和標題。若要快速存取剪輯設定：

• 按兩下 夾子 元素
• 選擇 夾子 元素並導航到 元素設定面板 (D)

貼上影片的 URL，根據需要添加標題，然後按 進入/返回。剪輯的預覽影像將顯示在剪輯元素中。

支援的剪輯來源

• Youtube （考慮使用 YouTube 影片元素來增強 YouTube 影片控制）
• 維梅奧
• 每日動態
• 眾籌 （只需貼上主要活動 URL，Webflow 將獲取主要活動剪輯）
• 泰德 （支援多種語言）
• 紫藤屬
• 優流
• 現場直播
• 抽搐
• 馬鈴薯網
• 葫蘆
• 萌芽視頻

透過我們的通知我們 願望清單 如果您的剪輯來源非常規，我們將努力將其納入其中！

‍至關重要的： 目前，不支援將視訊檔案提交到“資源”面板以在剪輯元素中使用。不過，您可以將影片上傳為靜音背景剪輯。

配置剪輯尺寸

Clip 元素一致地鏡像其包圍容器的尺寸（例如，當放置在 div 區塊內時，它繼承該 div 區塊的整個寬度）。如果您希望為剪輯指定不同的寬度和高度，請產生一個唯一的 div 區塊。從 中拖出一個 div 區塊 插入面板 並設定div塊的寬度和高度參數。將您的剪輯與此個性化 div 區塊關聯後，它將遵循該尺寸。

在您的網站上整合剪輯的其他方法

您也可以使用其他元件在您的網站上插入剪輯，例如：

• YouTube 剪輯
• 背景剪輯
• 燈箱
• 富文本
• 個性化程式碼嵌入

YouTube 剪輯元素

這 YouTube 剪輯 元素使您能夠嵌套來自 YouTube URL 的剪輯。此元素提供 YouTube 嵌入功能中可用的所有示範選項，例如顯示頻道中的相關影片、指定特定開始時間、顯示或隱藏影片控制等。了解有關 YouTube 剪輯元素的更多資訊。

動態影片部分

這 動態影片 部分可讓您合併沒有聲音的移動視覺效果。與僅容納 YouTube 和 Vimeo URL 的影片組件不同，動態影片部分可以處理您上傳的任何影片檔案。此外，動態視訊部分還包括一個用於播放/暫停功能的內建切換開關，使網站訪客能夠控制視訊背景。獲得有關動態視訊功能的更多見解。

彈出模態視訊元素

這 彈出模態視頻 元素允許網站訪客在彈出模型中啟動影片剪輯。與影片片段類似，彈出模式支援 YouTube 和 Vimeo URL。深入研究彈出模式視訊元素。

文字樣式元素和內容豐富的文字字段

文字樣式部分還允許您插入影片內容。當用於從 CMS 集合中的富文本欄位取得資料時，這會變得更加有效。

或者，一個 影片 部分可用於動態地從集合的視訊組件中取得資料。了解有關集合影片組件的更多資訊。

透過自訂程式碼嵌入添加視頻

您還可以使用以下命令集成 HTML 視頻 嵌入功能:

1. 訪問 添加部分
2. 放置一個 嵌入特徵 在工作區上
3. 插入您的 視訊程式碼 (了解有關 HTML 中視頻元素的更多信息)
4. 選擇 儲存並關閉