wordpress怎么自适应插入bilibili视频
前几天新酱在做另一个站的时候需要插入B站的视频，但是随后发现了一个严重的问题，bilibili的分享代码在wordpress上不会自适应，这就很麻烦了，经过测试bilibili给的分享代码只有在手机版才会适应，在电脑版只有很小的一块。
原版分享代码插入演示
这里我用原版的分享代码插入来形成一个对比。原版的分享代码可以在下图的位置得到。
|
1 |
<iframe src="//player.bilibili.com/player.html?aid=63007904&cid=109443932&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe> |
修改版分享代码插入演示
修改后的分享代码已经实现了自适应，不管是电脑版还是手机版都不会出现太大或者太小，无法全屏的问题，下面是修改版的代码。
|
1 2 3 4 |
<iframe id="spkj" src="https://player.bilibili.com/player.html?aid=你要分享的视频AV号&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width=100%> </iframe> <script type="text/javascript"> document.getElementById("spkj").style.height=document.getElementById("spkj").scrollWidth*0.76+"px"; </script> |
将你要分享的视频av号在代码中替换，av号就是bilibili链接里av后面的一串数字，比如我上面插入的视频链接是：
|
1 |
https://www.bilibili.com/video/av63007904/ |
63007904就是这个视频的av号。
2021年4月4日 下午7:41 4楼
大佬，我想问下我的视频并不是以AV结尾的，而是以BV结尾的，这个代码不太好用了，您可以帮忙看下吗，谢谢！
2021年4月4日 下午7:51 1层
@Robert Zhao 已经自行解决！多谢大佬的教程！我去找到了寻找正确的AV号的方法！感谢！
2021年1月29日 下午12:28 地板
在我这里效果不太好啊, ….不知道为啥宽度没适应, 也不出现进度条
(我插入到最后了, 因为代码没什么基础, 放中间有时会自动隐去剩余的文字了.)
xnview看图工具可以看max skp hdr Ai cdr等格式的预览图 – L 老师的窝: http://isublog.com/the-xnview-figure-tool-can-see-the-preview-of-the-max-skp-hdr-ai-is-the-cdr-format-2.html
2021年1月30日 下午4:50 1层
@isublog 我看了你插入的，原因在于你把javascript代码插入到了p标签里面，wordpress里选择源代码格式，然后把加在最后面保存
2019年11月24日 下午12:28 板凳
非常感谢大佬！
2019年12月2日 下午2:17 1层
@李君南 不客气。
2019年11月4日 下午8:02 沙发
非常感谢！相比于修改主题的代码，还是更喜欢这种方式！
2019年12月2日 下午2:19 1层
@简直药丸 不用客气。O(∩_∩)O哈哈~