hexohexoHexo中插入Bilibili视频
liuzhihang
修改matery主题首页显示视频为Bilibili视频
在Markdown插入Bilibili视频, 并设置大小.
首先找到分享嵌入代码

1
| <iframe src="//player.bilibili.com/player.html?aid=17963687&cid=29326684&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
|
在markdown中使用嵌入代码
调整大小和居中等
iframe标签属性设置
1 2 3 4 5 6
|
<iframe src="//player.bilibili.com/player.html?aid=17963687&cid=29326684&page=1" width="600" height="400" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
|
设置自适应
1 2 3
| <div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;"> <iframe src="//player.bilibili.com/player.html?aid=17963687&cid=29326684&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;"></iframe> </div>
|
matery 主题修改首页展示视频
找到 /themes/hexo-theme-matery/layout/_widget/video.ejs 将第十一行左右代码改成Bilibili视频即可, 引入的 script 可以删掉.
修改后如下.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| <div class="video-player"> <% if (theme.video.showTitle) { %> <div class="title center-align"> <i class="fas fa-video-camera"></i> <%- theme.video.title %> </div> <% } %> <div class="row"> <div class="col l8 offset-l2 m10 offset-m1 s12"> <div id="dplayer" class="dplayer-video"> <div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;"> <iframe src="//player.bilibili.com/player.html?aid=16316393&cid=26620787&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;"></iframe> </div> </div> </div> </div> </div>
|