📑 本文导航
在 WordPress 中插入在线视频非常简单,主要有以下两种常用方法,可以根据自己的编辑习惯进行选择:
方案 1:官方 iframe 嵌入(推荐,兼容所有 WP 版本,手机自动适配)
步骤 1:B 站复制嵌入代码
B站分享按钮位置
- 打开目标 B 站视频播放页
- 视频下方点分享 → 切换到嵌入代码标签
- 复制整段 iframe 代码 示例原始代码:
<iframe src="//player.bilibili.com/player.html?bvid=BV1xxxx&p=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>
步骤 2:WP 编辑器插入「自定义 HTML」区块
添加自定义HTML块
- 编辑文章,点编辑器左上角+
- 搜索 自定义 HTML,插入区块
- 粘贴上面的 iframe 代码
优化代码(必改,解决 3 大痛点:自适应、关闭自动播放、高清)
把复制的原始代码替换为下面完整版,只修改BV1xxxx为你视频的 BV 号即可:
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;margin:1rem 0;border-radius:6px;"> <iframe style="position:absolute;top:0;left:0;width:100%;height:100%;" src="https://player.bilibili.com/player.html?isOutside=true&bvid=BV1xxxx&p=1&autoplay=0&high_quality=1&danmaku=1" scrolling="no" frameborder="0" allowfullscreen loading="lazy"> </iframe> </div>
参数说明(按需修改)
- autoplay=0:关闭自动播放(浏览器强制限制自动播放,0 = 关闭,1 = 开启无效)
- high_quality=1:默认加载最高清晰度
- danmaku=1:开启弹幕,改为0关闭弹幕
- p=1:多 P 视频,数字代表第几集
方案 2:WP 简码 Shortcode(频繁插视频专用,不用反复粘贴 iframe)
1)添加简码函数(一次性配置)
后台 → 外观 → 主题文件编辑器 → 打开functions.php,拉到最底部粘贴代码:
// B站视频简码 [bilibili bv="BV1xxxx"]
function bilibili_video_shortcode($atts){
$args = shortcode_atts([
'bv' => '',
'page' => 1,
'danmaku' => 1,
'quality' => 1
],$atts);
if(empty($args['bv'])) return '请填写BV号';
$src = "https://player.bilibili.com/player.html?isOutside=true&bvid={$args['bv']}&p={$args['page']}&autoplay=0&high_quality={$args['quality']}&danmaku={$args['danmaku']}";
return '
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;margin:1rem 0;border-radius:6px;">
<iframe style="position:absolute;top:0;left:0;width:100%;height:100%;" src="'.$src.'" scrolling="no" frameborder="0" allowfullscreen loading="lazy"></iframe>
</div>
';
}
add_shortcode('bilibili','bilibili_video_shortcode');
保存,之后写文章直接用简码,无需 HTML 块:
plaintext
[bilibili bv="BV12345678"] # 多P、关闭弹幕写法 [bilibili bv="BV12345678" page="2" danmaku="0"]