提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

如何优雅的在WordPress插入Bilibili视频…

工具 WordPress 代码
2023-03-15 23:24:40 时间

由于B站的无广告特性，现在很多小伙伴都喜欢去B站，给自己喜欢的UP主一键三联。但B站自带的分享嵌入，插入到WordPress中，很丑很丑。

因此，找了各种资料，发现加点代码即可实现自适应，且美观大气。

B站自带的分享操作如下图：

# 默认分享嵌入代码：
<iframe src="//player.bilibili.com/player.html?aid=630411817&bvid=BV1G84y1c76n&cid=335718222&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

# 优化后嵌入代码（加入样式）：
<div style="position: relative; padding: 40% 45%;"><iframe src="//player.bilibili.com/player.html?aid=630411817&bvid=BV1G84y1c76n&cid=335718222&page=1&as_wide=1&high_quality=1&danmaku=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;"></iframe></div>

嫌每次手动修改忒不方便，便发挥半桶水的码农精神，基于.NET CORE做了个小工具，不确定各位能否在本机使用。

Bilibili地址转换小工具​blog.redq.cn/wp-content/uploads/2021/07/Bilibili%E5%9C%B0%E5%9D%80%E8%BD%AC%E6%8D%A2%E5%B0%8F%E5%B7%A5%E5%85%B7.zip

相关文章