WordPress新增影片的2種方式,無需安裝額外插件

Generic filters
Exact matches only
Search in title
Search in content
Search in excerpt
WordPress新增影片配圖
使用WordPress自帶元素或者是代碼的方式添加視頻,這2種WordPress添加視頻的方式都無需安裝額外插件。
文章目錄

本篇文章共916 字,預計閱讀時間4 分鐘

使用自帶元素為WordPress添加視頻

複製YouTube影片網址

在開始添加影片之前,先打開Youtube,選擇自己要新增的視頻,複製該視頻URL。

古騰堡編輯器添加視頻

古騰堡添加視頻元素

在古騰堡編輯器中添加影片元素。

貼上視訊網址

貼上之前複製的視訊地址。

效果展示

影片添加成功。

Elementor編輯器新增視頻

Elementor新增影片元素

在Elementor中搜尋影片元素並新增。

貼上影片連結

資源選擇YouTube,然後貼上先前複製的連結。

效果展示

Elementor新增影片成功。

使用代碼的方式添加視頻

複製YouTube影片嵌入程式碼

在使用程式碼新增影片之前,先點擊YouTube影片底部的分享按鈕並選擇嵌入。

複製YouTube影片嵌入程式碼2

然後複製影片的嵌入程式碼。

古騰堡編輯器添加視頻

古騰堡新增HTML元素

在古騰堡搜尋HTML元素並新增。

貼上嵌入程式碼

將複製好的嵌入程式碼貼到HTML元素中。

預覽效果

點擊預覽查看效果。

Elementor編輯器新增視頻

Elementor新增HTML元素

在Elementor搜尋並新增HTML元素。

貼上嵌入程式碼

貼上嵌入程式碼。

查看效果

預覽效果,高度有點不夠。

在程式碼裡調整高度:

調整程式碼中的高度
查看效果

調整後的效果。

插入Bilibili視頻

目前插入Bilibili影片只能透過嵌入程式碼的方式(不安裝插件的前提下)。

bilibili影片分享按鈕
bilibili影片嵌入程式碼

滑鼠放在B站影片下方的分享按鈕上,會顯示嵌入程式碼按鈕,點選複製程式碼。

原有的程式碼格式如下:

bilibili影片嵌入程式碼默然格式

在古騰堡或Elementor編輯器中加入HTML元素後,貼上嵌入程式碼到HTML元素即可成功新增。

- Well建站| 唯有二建站

但是添加完預設的嵌入程式碼後,發現影片的比例不對,寬度也不受控制,而且會自動播放。

所以我們要為程式碼添加寬度、比例和限制自動播放。

修改後的程式碼:

修改bilibili影片嵌入程式碼格式
  • 在程式碼中的URL部分最後面添加&自動播放=0,使影片不要自動播放。
  • 為程式碼添加style限制寬度和視訊比例,樣式=”寬度:300px;縱橫比:16/9;”

程式碼修改後,影片的展示效果:

- Well建站| 唯有二建站

至此,在WP裡加入影片的方法分享結束。

你可能還會關注:WordPress新增FAQ功能

: ) 文章內容均為原創,轉載須註明出處並添加原文鏈接,否則視為侵權
Well企業微信
专业网站搭建,扫码直接咨询
外貿伺服器推薦(Well在用的伺服器)
vultr-徽標
一線品牌VPS伺服器,穩定、不貴、效能強
Clouvider 標誌
二線品牌VPS伺服器,穩定、便宜、效能強
文章標籤
文章推薦
文章目錄
相關文章