WordPress添加视频的2种方式,无需安装额外插件

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部分最后面添加&autoplay=0,使视频不要自动播放。
  • 给代码添加style限制宽度和视频比例,style=”width:300px;aspect-ratio:16/9;”

代码修改后,视频的展示效果:

- Well建站 | 唯二建站

至此,在WP里添加视频的方法分享结束。

你可能还会关注:WordPress添加FAQ功能

: ) 文章内容均为原创,转载须注明出处并添加原文链接,否则视为侵权
外贸服务器推荐(Well在用的服务器)
vultr-logo
一线品牌VPS服务器,稳定、不贵、性能强
Clouvider-logo
二线品牌VPS服务器,稳定、便宜、性能强
文章标签
文章推荐
文章目录
相关文章
简体中文