wordpress 插入腾讯视频bilibili等网站视频代码教程,不会变扁

直接插入bilibili或者腾讯视频的分享代码后,保存后会发现文章页面的视频变的很扁。

直接上案例,案例使用bilibili,其他视频网站分享代码修改原理一样

比如说,我打算插入这个视频:https://www.bilibili.com/video/BV1rJ411r7UY

直接获取分享代码后,分享代码是这样

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

倘若直接插入上面的视频代码,看到的视频将会是这样

解决方法

需要手动修改一下代码

改成如下内容

<iframe id="video" src="//player.bilibili.com/player.html?aid=79254285&bvid=BV1rJ411r7UY&cid=135630360&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
<script type="text/javascript">document.getElementById("video").style.height=document.getElementById("video").scrollWidth*0.8+"px"</script>

注意看,一共修改了两个地方

第一个地方,在官方分享代码第一句 iframe 后面,添加了一个 id="video"

第二个地方,就是整个第二行

wordpress 插入这种视频分享代码的位置,插入,媒体,嵌入,填写嵌入代码

 

修改后使用效果如下

 

 

代码原文章:https://tech.mindseed.cn/WordPress/424.html

思羽布丁的黑苹果动力QQ群:15971419
欢迎赞助一下思羽布丁:https://www.mfpud.com/donations/
思羽布丁 » wordpress 插入腾讯视频bilibili等网站视频代码教程,不会变扁