美樂地

  • 首页
  • 简介
  • 文集
  • 友链
  • 留言
  • 赞助
  1. 首页
  2. 建站笔记
  3. 正文

免插件在WordPress文章中插入bilibili视频

2020-10-05 5347点热度 5人点赞 8条评论

在博文里插入视频,可以大大增加文章的可读性和说服力。之前我曾用优酷来分享视频,但不支持HTTPS、广告时间太长等严重缺陷导致我被迫放弃使用,转而使用bilibili视频(B站)。不过,外链的bilibili视频代码尽管没有广告,但仍有默认清晰度较低、默认出现弹幕、播放画面过小等问题,那有没有办法可以无需使用WordPress插件,仅仅用优化后的代码插入bilibili视频到文章中,实现完美的自适应播放呢?答案是当然有!

代码如下——

<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=(aid值/视频ID值)&bvid=(bvid值/视频编号值)&cid=(cid值/客户端ID值)&page=1&as_wide=1&high_quality=1&danmaku=0&autoplay=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视频。

无需插件,在WordPress文章中插入bilibili视频

在你需要插入的任一bilibili视频中,点击页面播放器下方的“转发”链接,找到“嵌入代码”并复制。嵌入代码格式如下——

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

将其中的  //player.bilibili.com/player.html?aid=45847374&bvid=BV1Yb411i7AU&cid=80336292&page=1  复制出来,替换我所提供的代码,链接包含aid、bvid、cid和page值。

参考代码如下:

<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=45847374&bvid=BV1Yb411i7AU&cid=80336292&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、Mac、iPad、手机等终端的游览器;

2.默认打开宽屏模式;

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

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

5.更改清晰度,或点击播放器的图标等情况,不会跳转到bilibili主站;

6.除了支持WordPress,还支持Typecho、Hexo、Ghost等支持HTML代码的程序。

这段是某时尚博主在海外旅行的Vlog,视频播放效果如下——

本文参考:

1.《关于博客园内嵌入bilibili视频》 ;

2.《关于接入B站iframe视频(bilibili引用视频)》 ;

本作品采用 知识共享署名 4.0 国际许可协议 进行许可
标签: bilibili视频
最后更新:2024-09-17

美樂地

这个人很懒,什么都没留下

打赏 点赞
< 上一篇
下一篇 >
赞助商
最近评论
流情 发布于 13 小时前(04月08日) 新的五年AI飞速发展会引来一个全新的时代,是机遇也是挑战。
obaby 发布于 21 小时前(04月08日) 高端和奢侈品消费也面临降级风险,毕竟,钱是真的难挣。
石樱灯笼 发布于 1 天前(04月07日) 这也太AI了
美樂地 发布于 5 天前(04月03日) 下午已发您,收到了吗?
幽谷 发布于 6 天前(04月03日) 你好已打赏12,麻烦给份驱动
最新 热点 随机
最新 热点 随机
已撤牌的本地五星级豪华酒店 网站在 SSL Labs 测试中获得 A+ 评级的教程 为网站启用 HSTS 支持 DIY美味又营养的卷饼 解决BackWPup在aaPanel(宝塔)环境下报错的问题
入手iPhone 17标准版DIY美味又营养的卷饼丙午马年到!网站在 SSL Labs 测试中获得 A+ 评级的教程为网站启用 HSTS 支持
网件 Netgear R6400 刷梅林改版固件教程 恭喜我!免费Win7旗舰版即将到手! 已撤牌的本地五星级豪华酒店 Notability No,GoodNotes Yes! iOS 5.1.1系统完美越狱教程
标签聚合
iPhone WordPress Google 我的大学 高清电影 Windows 7 段子 Apple

COPYRIGHT © 2009-2026 美樂地 Meledee.com. ALL RIGHTS RESERVED.

Theme Kratos Modified By 美樂地|Meledee.com