WordPress 网站文章中引用插入哔哩哔哩bilibili视频

在博客文章嵌入 bilibili（B站）视频，如果直接使用bilibili 的分享代码，视频播放窗口特别小，无法做到PC电脑端和移动手机端播放器画面大小自适应。而且，默认的清晰度较低、默认出现弹幕等问题，影响视频观看体验。

那么有没有办法解决以上问题的同时，转载B站视频到我们的网站呢？其实也很简单，通过本文提供的代码就可以完美实现！

具体实现方法：

点击您需要分享的bilibili 视频下方的“转发”按钮（箭头标志那个），点击复制“嵌入代码”，默认的嵌入代码格式如下：

<iframe src=”//player.bilibili.com/player.html?aid=215631694&bvid=BV1ua411p7iA&cid=765060141&page=1″ scrolling=”no” border=”0″ frameborder=”no” framespacing=”0″ allowfullscreen=”true”> </iframe>

将其中的  aid=215631694&bvid=BV1ua411p7iA&cid=765060141 替换下方代码对应的部分就行了。

最终代码如下：

<div style="position: relative; padding: 30% 45%;">
 
<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="//player.bilibili.com/player.html?aid=215631694&bvid=BV1ua411p7iA&cid=765060141&page=1&as_wide=1&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>

此代码优点：

1.自适应PC、iPad、手机等终端的浏览器；

2.默认打开宽屏模式；

3.关闭恼人的弹幕功能；

4.默认启用高清晰度播放，如视频支持1080P，以1080P清晰度播放；

5.更改清晰度，或点击播放器的图标，不会跳转到bilibili主站；

6.除了支持WordPress，还支持Typecho、Hexo、Ghost等程序。

效果如下：

 

当然，如果您跟本站一样，使用的是Modown 主题，那添加B站视频就更简单了。直接在编辑器点击”嵌入外链视频“按钮，粘贴src值（iframe src=后第一个引号中的内容）即可一键添加，非常方便。