目录记录与分享可以让自己记忆更深刻并帮助他人。
一、前言
我是从2023年初开始在CSDN上写自己的博客，但是奈何CSDN上广告繁多，内容质量也参差不齐，之前一直想转到博客园上，这两天才付诸行动并实现博客园界面的相关优化，并将其记录分享。
二、如何美化博客园
由于我们刚注册完成博客园后，官方的模板界面一般看起来比较陈旧，并不那么美观，所以我们需要进行配置一个我们所满意的博客界面。
- 首先进入博客园设置界面，需要重点关注红色框选部分的配置。
新注册的账号需要开通JS权限，一般这样写样例即可：
尊敬的管理员：您好，我需要自定义主题，麻烦通过下我的JS权限申请，谢谢！
- 继续注意公式框选部分
- 保存后，我们进行
选项配置，我的配置如下，大家可以参考。设置好记得保存
- 回到
设置界面，并在页面定制CSS代码输入如下内容，并一定勾选禁用模板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;}}
- 在
页首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://xxxx.jpg", //你的头像
headerBackground:
"https://xxxx.jpg", //你的界面顶部背景图
},
highLight: {
enable: true,
},
lineNumbers: {
enable: true,
},
github: {
enable: true,
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>",
"Always keep a beginner's mind, don't forget the beginner's mind.",
"<b>花开堪折直须折，莫待无花空折枝。</b>",
"<b>一件事情不付诸实践，即使在心里想一万遍也是徒然。</b>",
"<b>一沙一世界，一花一天堂。君掌盛无边，刹那成永恒。</b>",
"<b>
标签：enable,界面,博客园,雪花,https,var,true,top,美化
From： https://www.cnblogs.com/lgziyan/p/17935784.html