如何在 WordPress 中嵌入 YouTube 視頻(分步指南)
已發表: 2021-10-10當您在 WordPress 內容中嵌入 YouTube 視頻時,它可以幫助吸引讀者,增加在頁面上花費的時間,並為用戶提供更好的體驗。
您可以通過多種方式將視頻嵌入到 WordPress 的內容中。 在這個分步教程中,我們將帶您了解每種方法。 在本指南的最後,您將了解如何將 YouTube 視頻準確地包含在您的 WordPress 帖子和頁面中,以及如何讓它們以您想要的方式查看和工作。
方法 1:使用剪切和粘貼嵌入 YouTube 視頻
我們將從最簡單的方法開始,即簡單地將 YouTube 視頻 URL 粘貼到您的內容中。
如果您使用的是 WordPress 塊編輯器,它會自動檢測到您粘貼了視頻鏈接並將其轉換為適當的塊。
第 1 步:複製視頻 URL
最簡單的方法是在瀏覽器地址欄中選擇整個 URL,然後在 PC 上按 CTRL+C 或在 Mac 上按 Command+C(或用兩根手指右鍵單擊/單擊以調出上下文菜單並選擇“複製”。

您也可以向下滾動到視頻下方,然後單擊“分享”鏈接。 將出現一個彈出窗口,其中包含用於在社交媒體上共享的 URL 和鏈接。 還有一個“嵌入”選項,但您現在可以忽略它。
如何從特定時間開始在 WordPress 中嵌入 YouTube 視頻
實用提示:如果您使用 YouTube 共享彈出窗口中的鏈接,您可以選擇在特定時間戳開始嵌入 YouTube 視頻。
只需在您希望開始播放的位置暫停視頻,然後單擊“共享”鏈接以彈出帶有共享選項的彈出窗口。 然後勾選“從 2:18 開始”(或您暫停視頻的任何時間)旁邊的框,然後單擊“複製”以復制鏈接。 這將向 URL 添加一個參數,以便在您暫停時啟動它。

第 2 步:將 URL 粘貼到您的內容中
複製視頻 URL 後,只需將其粘貼到您的內容中即可。 單擊顯示“開始寫入或鍵入/以選擇一個塊”的位置,然後按 CTRL-P/Command-P 或右鍵單擊並選擇“粘貼”。

WordPress 會檢測到您粘貼了 YouTube 視頻鏈接,並會自動將其轉換為 YouTube 塊。

方法 2:使用 YouTube 塊
在 WordPress 帖子中嵌入 YouTube 視頻的第二種方法是自己創建一個 YouTube 塊。
第 1 步:複製 YouTube 視頻網址
此方法的啟動方式與復制粘貼方法完全相同:從瀏覽器的 URL 欄中或 YouTube“共享”彈出窗口中復制要嵌入的視頻的 URL。
第 2 步:創建 YouTube 區塊
有兩種方法可以將新塊添加到您的 WordPress 內容中。 選擇您喜歡的那個。
您可以單擊 + 圖標,這將彈出一個彈出窗口,您可以在其中瀏覽或搜索塊類型。

單擊“YouTube”選項以創建 YouTube 塊。 如果它不是立即可見的,您可能需要搜索它。
或者,如果您更喜歡完全通過鍵盤工作而不是單擊鼠標或觸控板,您可以鍵入“/”以顯示常用塊列表,使用箭頭鍵滾動到 YouTube 選項,然後按 Enter 創建 YouTube堵塞。

第 3 步:粘貼 YouTube 網址
單擊顯示“輸入要在此處嵌入的 URL...”的位置,然後按 CTRL-P/Command-P 或右鍵單擊並選擇“粘貼”將 URL 粘貼到 YouTube 塊中,然後單擊“嵌入”按鈕。

嵌入視頻後,您將看到它在您的內容中的外觀。

方法 3:使用視頻塊
您還可以使用 WordPress 視頻塊將 YouTube 視頻嵌入到您的帖子和頁面中。 沒有理由在 YouTube 視頻塊上使用此塊,但如果您有一個現有的自託管視頻或來自其他網站的視頻想要更改為 YouTube 視頻,您可以編輯該塊以插入 YouTube URL。
第 1 步:複製 YouTube 網址
從瀏覽器地址欄或 YouTube“分享”彈出窗口中復制 YouTube URL,與前兩種方法完全相同。
第 2 步:找到 WordPress 視頻塊
單擊 + 圖標並在結果彈出窗口中鍵入“視頻”以查找視頻塊

第 3 步:創建視頻塊
單擊“視頻”選項以創建視頻塊。 單擊“從 URL 插入”選項。

第 4 步:粘貼 YouTube 視頻網址
將您之前複製的 YouTube URL 粘貼到彈出的字段中,然後按 Enter。 WordPress 將創建一個顯示視頻的 YouTube 塊。
您還可以使用此方法嵌入來自其他站點的視頻。
方法 4. 使用 iframe 嵌入 YouTube 視頻
還有另一種方法可以將 YouTube 視頻嵌入到您的帖子和頁面中,這種方法更具技術性,但如果標準嵌入不起作用,它可以作為一種替代方法。
如果您樂於編輯代碼,您還可以通過此方法更好地控制視頻的顯示方式。
但請注意 - 以這種方式嵌入視頻可能會與您的主題發生衝突並弄亂您的內容格式。 因此,在您嘗試了其他方法之後,請將其視為最後的手段。
第 1 步:複製 YouTube 嵌入代碼
以這種方式嵌入 YouTube 視頻需要的不僅僅是視頻 URL。 幸運的是,YouTube 為您提供了所需的代碼。
在 YouTube 上找到您要鏈接的視頻,然後單擊視頻下方的“分享”鏈接。 單擊“嵌入”選項。

這將顯示視頻和代碼的預覽,以將其嵌入為 iframe。 單擊“複製”以復制代碼。

第 2 步:將自定義 HTML 塊添加到您的 WordPress 帖子或頁面
返回您的 WordPress 儀表板,單擊 + 圖標以添加一個新塊,如前面的步驟所示。
搜索“自定義 HTML”並選擇塊以將其添加到您的內容中。

第 3 步:粘貼 YouTube 嵌入代碼
使用 CTRL-P/Command-P 將剛剛從 WordPress 複製的代碼粘貼到塊中。

如果您單擊代碼上方的“預覽”選項,您應該能夠看到嵌入的視頻。

方法 5:如何將 YouTube 視頻嵌入為 WordPress 側邊欄小部件
您可以將 YouTube URL 粘貼到小部件中,就像您可以粘貼到頁面和發佈內容一樣。

如果您想在 WordPress 網站的側邊欄、頁腳或其他位置嵌入 YouTube 視頻,您可以將其添加為小部件。
第 1 步:複製 YouTube 視頻網址
與大多數其他嵌入方法一樣,首先在 YouTube 上找到要鏈接的視頻並複制視頻的 URL。
第 2 步:將文本小部件添加到您的 WordPress 網站
轉到 WordPress 儀表板中的外觀 > 小部件,然後將新的文本小部件拖到側邊欄或任何其他小部件區域。

第 3 步:將視頻 URL 粘貼到文本小部件中
確保選擇主要內容區域的“視覺”選項卡而不是“文本”。 將 YouTube 視頻 URL 粘貼到小部件的主要內容區域。
如果嵌入有效,您應該立即看到視頻,因為它會出現在您的網站上。

如果您願意,還可以為小部件添加標題。
第 4 步:保存小部件
確保單擊小部件底部的“保存”按鈕以發布您的更改。 您現在應該能夠在站點前端的側邊欄小部件區域中查看視頻。

方法 6:使用 WordPress 視頻嵌入插件
您無需使用插件將 YouTube 視頻嵌入 WordPress。 但是,插件可以提供額外的查看選項和高級功能。
您可能想嘗試的一些插件包括:
適用於 YouTube 的嵌入 Plus

Embed Plus 可讓您從頻道或播放列表嵌入 YouTube 視頻庫。 您可以從多個圖庫佈局中進行選擇,也可以選擇在燈箱中播放視頻。 您還可以將實時聊天和實時流嵌入到您的 WordPress 網站中。
還有更多用於顯示和播放 YouTube 視頻的高級選項,包括顯示或隱藏播放器控件、自動播放視頻、默認打開或關閉字幕、循環播放視頻等。
價格:基本版免費,高級插件 39.99 美元起
為 YouTube 獲取 Embed Plus
適用於 YouTube Pro 的 Smash Balloon Feed

Smash Balloon YouTube 插件可讓您輕鬆在您的網站上創建風格精美的 YouTube 提要,其功能包括視頻搜索、自定義暫停和結束操作、直播等。
該插件包含一個 Gutenberg 塊,因此可以直接從塊編輯器中快速添加 YouTube 提要,並且有多種提要佈局和自定義選項可以按照您想要的方式設置提要樣式。
價格:49 美元
獲取 Smash Balloon YouTube 供稿
YotuWP Easy YouTube 嵌入

YotoWP 是 WordPress 的視頻庫插件,可以輕鬆為您的 YouTube 視頻創建漂亮的畫廊,並可選擇按播放列表或頻道導入多個視頻。
該插件專為快速加載和輕鬆定製而設計,可選擇 5 種縮略圖樣式、視頻燈箱彈出窗口、帶有大播放器的視頻庫佈局、縮略圖懸停動畫等。
價格:基本功能免費,高級功能 21 美元
獲取 YotoWP 視頻庫插件
WP YouTube 萊特
如果您將多個視頻嵌入到您的 WordPress 內容頁面之一,它可能會顯著減慢頁面速度。 這是因為每個視頻都會從 YouTube 加載外部腳本。
WP YouTube Lyte 插件允許您“延遲加載”YouTube 視頻,以便僅在播放視頻時加載腳本。 這可以顯著減少您的頁面加載時間並加快您的網站速度。
價格:免費
獲取 WP YouTube Lyte
PublishPress 塊 高級視頻塊

PublishPress Blocks 並不是真正的視頻嵌入插件。 它是 Gutenberg 塊的集合,您可以將其添加到基本的 WordPress 塊中,以獲得各種內容類型的額外樣式和格式選項。
該插件包括按鈕、圖像、表單、表格和其他內容元素的塊以及視頻塊。
您可以使用高級視頻塊嵌入來自 YouTube 和 Vimeo 的視頻。 您可以選擇在燈箱中播放視頻、調整視頻大小、更改顏色設置以及播放按鈕樣式和大小。
價格: 99 美元,包括 PublishPress 主題和所有用於安排內容、管理作者、權限和修訂的 PublishPress 插件。 此捆綁包非常適合改進具有多個作者的大型網站的內容髮布過程。
訪問 PublishPress 塊
YouTube 視頻嵌入常見問題解答
前三種方法都具有相同的結果(使用嵌入視頻創建 YouTube 塊),因此您可以使用您覺得更容易的任何方法。 (我推薦基本的剪切和粘貼方法!)
如果您想要更高級的播放控件或顯示選項,請嘗試使用其中一個視頻嵌入插件來獲得額外的視頻嵌入功能。
是的。 WordPress 支持來自以下網站的視頻嵌入:
- 亞馬遜
– 視頻出版社
- YouTube
– 維密歐
——動畫本
– 每日運動
– TikTok
– 泰德
– WordPress.tv
– 雲上
– 弗里克
– 棒棒糖
如果您將任何這些網站的視頻鏈接粘貼到您的內容中或使用視頻塊,WordPress 會將其轉換為適當的塊並自動嵌入視頻。
YouTube 塊包括一個可選的標題。 嵌入視頻後,只需在視頻下方單擊,然後在“Write caption...”提示中鍵入即可。
如果您單擊 YouTube 塊上方工具欄中的對齊圖標,您可以調整視頻的對齊方式,這也會調整其大小。 向左或向右對齊視頻會使其更小。
但是,要更好地控制視頻的大小,您需要使用插件,使用 iframe 嵌入方法並編輯代碼來調整視頻大小,或使用自定義 CSS 來調整大小。
這些說明適用於使用 Gutenberg 塊編輯器,但您可以使用相同的剪切和粘貼方法將 YouTube 視頻嵌入 WordPress 經典編輯器。
只需將 URL 複製並粘貼到可視視圖中的編輯器中,您就會看到視頻的預覽。
如果您的視頻嵌入不起作用,可能有幾個原因。
首先,通過將其粘貼到瀏覽器中來檢查您複製的鏈接。 您只能使用 WordPress YouTube 塊嵌入標準 YouTube 視頻,並且不能鏈接到 YouTube 頻道。
如果鏈接與瀏覽器地址欄中的鏈接不同,您也可以嘗試從 YouTube 共享彈出窗口復制鏈接。
如果您確定鏈接正確,請嘗試使用上面的 iframe 視頻嵌入方法。 有時,當標準視頻嵌入失敗時,此方法會起作用。
有時視頻嵌入不起作用,因為創建者已禁用嵌入或隱私設置不允許共享。 如果是這種情況,您將不得不找到其他視頻。
如果您無法嵌入任何視頻,則可能是某個插件禁用了 WordPress 的嵌入功能。 嘗試一一禁用您的插件,看看是否有任何插件導致問題。
雖然您可以將視頻直接上傳到 WordPress 並將它們託管在您自己的網站上,但在大多數情況下,我們不建議您這樣做。
視頻佔用大量磁盤空間和帶寬。 YouTube 針對視頻進行了優化,因此它們加載速度很快,只要您的連接速度合理,就不應該有太多緩衝。
如果您在自己的網站上託管視頻,它們可能會加載緩慢、幾秒鐘後停止播放,或者在某些設備上根本無法播放。 視頻也會佔用您的服務器資源,對您網站的過多請求可能會減慢一切。 託管大量視頻的網站通常需要為額外的服務空間和帶寬支付大量託管費用。
最後的想法
我希望本指南能幫助您在自己的網站上嵌入 YouTube 視頻。 在 WordPress 中很容易做到! 還有其他問題或提示嗎? 繼續,將它們留在評論中!