• 2022年4月20日

WordPress免插件嵌入B站视频代码支持1080P播放

科技才是第一生产力,B站视频无广告,非常适合博客网站引用,企业官网引用也不掉价,但B站默认嵌入代码不支持网页自适应,仅支持360P播放,本方法可以实现B站视频嵌入网页自适应,支持手动切换分辨率,点击B站图标不会跳转到视频页,支持1080P播放,甚至2K4K播放,具体方法如下。

步骤一,B站视频页,分享按钮,复制分享代码。

B站默认分享代码如下:

<iframe src="//player.bilibili.com/player.html?aid=497709283&bvid=BV1UK411L7G1&cid=177598551&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

我们需要的内容是//player.bilibili.com/player.html?aid=497709283&bvid=BV1UK411L7G1&cid=177598551&page=1,它包含了(aid值/视频ID值)&bvid=(bvid值/视频编号值)&cid=(cid值/客户端ID值)这些关键信息。

步骤二,复制以上关键信息到以下代码中。将以上链接信息,和代码中的“替换区”更换。

<div style="position: relative; padding: 30% 45%;">
<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="替换区&high_quality=1&danmaku=0" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>
</div>

实际效果如下:

你以为这是我的创举吗?当然不是,我这也是拾人牙慧,我是从美乐地《免插件在WordPress文章中插入bilibili视频》https://meledee.com/2020/10/3270.html摘录过来的。不过以上代码太长,需要你先准备一个网页保存以上代码,以供使用时复制粘贴,有没有更方便的操作呢?有的,这需要一款插件的配合。

现在请出可定制WordPress编辑器图标按钮功能的AddQuicktag插件,可以从插件市场一键安装,安装后使用方法如下。

B站就是编辑器上的按钮名,里面的代码,点击一下按钮就会出现在编辑器里面,后面的三个勾,是日志、页面、评论区编辑器里面加入此代码的意思。

更具体的操作就没一一演示了,请自行摸索。

话外,其实上面最核心的信息是497709283&bvid=BV1UK411L7G1&cid=177598551,两组数字之间的内容才是最关键的,所以替换区的内容也可以做相应调整,选择复制时更方便一些。