如何創建響應式 YouTube 視頻滑塊

已發表: 2020-04-06

如果您是 youtube 頻道的所有者,該頻道在您的服務中包含許多視頻,此外,您正在運行一個 WordPress 網站,並且您需要在您的 WordPress 網站上創建一個響應式 youtube 視頻滑塊,在這種情況下,我建議您關注本文。

本文包含有關在 WordPress 網站上創建響應式 youtube 視頻滑塊的完整分步說明。 我將展示創建它的最佳和最簡單的方法,這樣您就無需具備任何編碼技能即可在自己的 WordPress 網站上創建完整的 youtube 視頻滑塊。

WordPress 視頻滑塊對您的網站有益,因為它很容易吸引訪問者的注意力。 因此,它提高了對話率和銷售額。 您可以在 WordPress 網站上輕鬆展示您的 youtube 頻道的視頻。

默認情況下,沒有在 WordPress 中創建視頻滑塊的選項。 因此,如果您想在您的網站上創建 WordPress youtube 視頻滑塊,您必須選擇最好的插件之一,例如WordPress Carousel Pro ,它可以讓您輕鬆創建響應式 youtube 視頻滑塊。

響應式 YouTube 視頻滑塊
響應式 YouTube 視頻滑塊

如果我們想使用WordPress Carousel Pro插件創建一個 youtube 視頻滑塊,我們必須遵循3 個步驟。

Step-1: WordPress Carousel Pro 插件的安裝和激活

第 2 步:添加新的 Youtube 視頻輪播

第 3 步:在 WordPress 網站上顯示 Youtube 視頻輪播

第1步。 WordPress Carousel Pro 插件的安裝和激活

首先,我們必須安裝並激活 WordPress Carousel Pro 插件才能繼續創建 WordPress youtube 視頻滑塊。 任何 WordPress 插件的安裝和激活都是一樣的。 但是,如果您需要任何指導,您可以按照此安裝和激活說明進行操作。

WordPress輪播專業版

第 2 步:添加新的 Youtube 視頻輪播

我已經成功完成了插件的安裝和激活。 現在是時候創建我們的第一個 youtube 視頻輪播了。 這是一個非常快速和簡單的過程。 但是,一旦您完成激活,您將在 WordPress 儀表板菜單中找到WP Carousel Pro菜單。 現在單擊添加新菜單,它將打開一個包含許多字段的界面。 現在,用您的內容填寫字段。 在這種情況下,請逐步按照指南進行操作。

(i) 輪播標題:在此字段中為 youtube 視頻輪播提供標題。

(ii) 輪播類型:您可以使用 WordPress Carousel Pro 插件創建多用途輪播。 由於我們要創建一個 youtube 視頻滑塊,只需選擇視頻輪播類型。

選擇輪播類型:視頻

(iii) 添加視頻:選擇視頻輪播類型後,您會找到添加視頻的按鈕。 因此,單擊添加視頻按鈕。 因此,它將打開一個帶有以下輸入字段的界面。

視頻輸入場

您可以看到有一個選擇視頻源的選項。 您可以選擇來自不同來源的視頻。 由於我們要創建一個 youtube 視頻滑塊,我們必須選擇Youtube作為視頻源。 它看起來像下面的屏幕。

選擇:視頻源

此外,在這個階段,現在我們需要輸入要添加到您的 youtube 視頻輪播中的視頻 ID。 為此,請轉到特定的視頻鏈接並收集 ID 並在視頻 ID字段中設置 ID。 它看起來像下面的屏幕。

提供視頻 ID

但是,您可以輕鬆克隆視頻。 因此,按照相同的程序,添加視頻,根據您的需要添加多少。 您也可以拖放視頻。

(iv) 輪播定制:插件是高度可定制的。 您可以根據需要自定義任何字段。

(v) 發布:完成自定義後,就可以完全準備好發布 youtube 視頻輪播了。 現在,單擊“發布”按鈕將其發布。

第 3 步:顯示 Youtube 視頻輪播

最後,我們成功創建了 youtube 視頻輪播。 因此,現在我們已完全準備好在我們的 WordPress 網站上顯示 youtube 視頻輪播。 現在,您必須複製短代碼並將其粘貼到您想要的任何位置。

生成的簡碼

古騰堡編輯

如果您在 WordPress 主題中使用古騰堡編輯器,您可以粘貼短代碼,它看起來像以下屏幕。

古騰堡編輯

經典編輯器

您也可以使用名為 Classic Editor 的舊編輯器。 如果您將短代碼粘貼到經典編輯器中,它看起來像以下屏幕。

經典編輯器

我複制了簡碼並粘貼在一個頁面上,最後在我的 WordPress 網站上找到了以下結果。

Youtube 視頻輪播滑塊

Youtube 視頻輪播定制

有一些選項可以自定義視頻輪播並以不同的外觀和感覺來表示它。 如果您想顯示視頻的標題,只需從以下標題和說明字段中添加標題。

視頻標題

現在,單擊樣式設置選項卡並向下滾動到描述顯示和隱藏選項。 因此,只需打開選項即可顯示內容。 您可以按照下面的屏幕截圖進行操作。

視頻說明 打開

完成此步驟後,現在查看結果。 我已經做到了,並找到了以下結果。

帶有標題的 Youtube 視頻輪播

而且,這裡還沒有結束。 此外,您還可以為每個視頻添加說明。 如果要添加描述,您可以輕鬆地按照添加標題的過程進行操作。 它看起來像以下一個 -

視頻說明

最後,再次刷新您粘貼短代碼的頁面,您還將看到視頻描述。 它看起來像以下一個 -

帶有標題和說明的 YouTube 視頻輪播

此外,您還可以自定義視頻圖標顏色。 如果您對自定義視頻圖標顏色感興趣,則必須單擊“樣式設置”選項卡並轉到“視頻圖標顏色”選項。 但是,它看起來像以下一個 -

視頻圖標顏色自定義

此外,我選擇了紅色作為視頻圖標顏色。 現在,返回您的輪播滑塊預覽,然後刷新它。 刷新後,您會發現圖標顏色發生了變化。 我有以下一個。

視頻圖標顏色輸出

最後的話

最後,我在這篇文章的結尾,我希望你已經完成了你的工作,並按照最好和最簡單的方法成功地創建了你的第一個 youtube 視頻輪播。