怎样让博客更好看
博客皮肤选择Custom,再页面定制CSS代码中填入
#loading{bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999;background-color:#f4f5f5;pointer-events:none;}.loader-inner{will-change:transform;width:40px;height:40px;position:absolute;top:50%;left:50%;margin:-20px 0 0 -20px;background-color:#3742fa;border-radius:50%;animation:scaleout 0.6s infinite ease-in-out forwards;text-indent:-99999px;z-index:999991;}@keyframes scaleout{0%{transform:scale(0);opacity:0;}40%{opacity:1;}100%{transform:scale(1);opacity:0;}}
(记得把禁用模版默认CSS打开)
在业首HTML代码中填入<div id="loading"><div class="loader-inner"></div></div>。
在页脚HTML代码中填入
<script src="https://guangzan.gitee.io/awescnb/index.js"></script>
<script>
const opts = {
theme: {
name: 'geek',
url: "https://acnblogs.gitee.io/acnb-theme-geek/index.iife.js",
log: true,
avatar: "https://images.cnblogs.com/cnblogs_com/blogs/840523/galleries/2447096/o_250328224322_%E5%A4%B4%E5%83%8F.jpg", //你的头像
headerBackground:
"https://images.cnblogs.com/cnblogs_com/blogs/840523/galleries/2447096/t_250328232835_%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-29%20072731.png", //你的界面顶部背景图
},
highLight: {
enable: true,
},
lineNumbers: {
enable: true,
},
github: {
enable: false,
url: "https://github.com/xxxx",//你的github账号,没有可以enable:false
},
gitee: {
enable: false,
url: 'https://gitee.com/xxxxxx',//你的gitee账号,没有可以enable:false
},
click: {
enable: true,
},
emoji: {
enable: true,
},
darkMode: {
enable: true,
autoDark: true,
autoLight: false,
},
qrcode: {
enable: false,
img: 'https://weiyigeek.top/img/wechat-search.png',//你的微信公众号图片,没有可以enable:false
desc: 'WeiyiGeek 公众号',//你的微信公众号名
},
donation: {
enable: false,
qrcodes: ['https://cdn.jsdelivr.net/gh/weiyigeek/weiyigeek.github.io/img/reward-alipay.png'],
},//你的支付宝赞赏图片,没有可以enable:false
signature: {
enable: true,
contents: [
"<b>💡 有理想,但不妄想, 💭 有希望,但不奢望, 🐬 有作为,但不妄为。</b>",
],//你的个性签名
},
postSignature: {
enable: true,
enableLicense: true,
content: ['署名-非商业性使用-相同方式共享 4.0 国际', 'https://creativecommons.org/licenses/by-nc-sa/4.0/'],
},
links: {
enable: true, //下面部分可以定义你的其他相关界面、账号的链接
value: [
{
name: "🍞 OI Wiki",
link: "https://oi-wiki.org/",
},
{
name: "🎨 博客主页",
link: "https://www.cnblogs.com/",
},
// {
// name: "👨💻 博主介绍",
// link: "https://blog.weiyigeek.top/about/index.html",
// },
{
name: "🍻 luogu主页",
link: "https://www.luogu.com.cn/user/1022974",
},
{
name: "🧀 Bilibili",
link: "https://space.bilibili.com/1531385378?spm_id_from=333.1007.0.0",
},
// {
// name: "🍪 今日头条",
// link: "https://www.toutiao.com/c/user/token/MS4wLjABAAAAqcPSoMqfctaEqJpGSF775eeCjWkrop4AOyLITdMx-L78F5iXzfQcSRM5sY4dq3wR/?source=author_home",
// },
// {
// name: "🦁 百家号",
// link: "https://author.baidu.com/home?from=blog&app_id=1726736601523415",
// }
],//这些都是“传送门”,可以自己更改,后面的是网页地址
},
};
$.awesCnb(opts);
</script>
<script type="text/javascript">
window.onload = function () {
var minSize = 10; //最小字体
var maxSize = 20; //最大字体
var newOne = 500; //生成雪花间隔
var flakColor = "#f5f5f5fa"; //雪花颜色
var flak = $("<div></div>").css({ position: "absolute", "top": "0px", "z-index": "9999" }).html("✽"); //定义一个雪花,添加了 z-index
var dhight = $(window).height(); //定义视图高度
var dw = $(window).width() - 80; //定义视图宽度
setInterval(function () {
var sizeflak = minSize + Math.random() * maxSize; //产生大小不等的雪花
var startLeft = Math.random() * dw; //雪花生成是随机的left值
var startOpacity = 0.7 + Math.random() * 0.3; //随机透明度
var endTop = dhight - 100; //雪花停止top的位置
var endLeft = Math.random() * dw; //雪花停止的left位置
var durationfull = 5000 + Math.random() * 3000; //雪花飘落速度不同
flak.clone().appendTo($("body")).css({
"left": startLeft,
"opacity": startOpacity,
"font-size": sizeflak,
"color": flakColor
}).animate({
"top": endTop,
"left": endLeft,
"opacity": 0.1 //修正了拼写错误:"opacity"
}, durationfull, function () {
$(this).remove()
});
}, newOne);
}
</script>
在页脚代码里,我给你写了一些注释,自己可以调整,没写注释的就不用管了(记得要有JS权限才行,没有也没事,申请一下就好了,理由就填“想装饰博客,让读者在阅读时更加愉快”即可)

浙公网安备 33010602011771号