172 words
1 minutes
Butterfly主题随机封面图
Hexo的Butterfly主题不支持随机封面,所以我写了这个js
新建JS文件
- 在
source
文件夹下新建js
目录,并在里面新建rphoto.js
(确保没有与当前文件夹里的文件和主题相对应文件夹里面的文件名字冲突) - 以下是
rphoto.js
的内容
function randomPic() {
var backPicture = document.getElementById("page-header");
if (backPicture.style.backgroundImage == "") {
var background_urls = [
'https://s2.loli.net/2022/01/29/yX7lju25TbMVLnS.jpg',
'https://s2.loli.net/2022/01/29/AyD3mTLvPa6YxN4.jpg',
'https://s2.loli.net/2022/01/29/2ANgyCud5mf9SLX.jpg',
'https://s2.loli.net/2022/01/29/ijTcD4sNQGtI7aO.jpg',
'https://s2.loli.net/2022/01/29/lZfxzh2w83Y7UAH.jpg',
'https://s2.loli.net/2022/01/29/7fWJp48Dm6kV3tA.jpg',
'https://s2.loli.net/2022/01/29/Bt7njKX3pckosEA.jpg',
'https://s2.loli.net/2022/01/29/YfIERQGwPyWpF95.jpg',
'https://s2.loli.net/2022/01/29/oZUCqWKr2w1DO35.jpg',
'https://s2.loli.net/2022/01/29/2n34ZH1LEsWgxJI.jpg',
'https://s2.loli.net/2022/01/29/anU8Pp4syA1DfcJ.jpg',
'https://s2.loli.net/2022/01/29/TbcZ3pC4ev7MBKS.jpg',
'https://s2.loli.net/2022/01/29/WpYuKRmxjNkzt8a.jpg',
'https://s2.loli.net/2022/01/29/PHR7bGNJgpS1xrB.jpg',
'https://s2.loli.net/2022/01/29/eJqjtFW329GiLQD.jpg',
'https://s2.loli.net/2022/01/29/MgK18FvA9rc7ipV.jpg',
'https://s2.loli.net/2022/01/29/E4br3gUDTLVKp8o.jpg',
'https://s2.loli.net/2022/01/29/WDzVHu9MgtC1fQ4.jpg',
'https://s2.loli.net/2022/01/29/wPavu8hCZL5VXmN.jpg'
]
var url = background_urls[Math.floor((Math.random() * background_urls.length))];
var urlPhoto = ('background-image:url(' + url + ')');
console.log("BackGround URL:" + url);
backPicture.setAttribute("style", urlPhoto);
}
}
修改 _config.butterfly.yml
- 将
default_top_img
内容改为url
- 在
inject
的bottom
中 (大约823行左右),添加以下内容
- <script src="/js/rphoto.js"></script>
- <script data-pjax>randomPic()</script>
Butterfly主题随机封面图
https://www.noctiro.moe/posts/hexo-butterfly-random/