美化博客园主题--1
1、进入博客园管理界面
2、点击上方的设置，进入设置页面
3、修改皮肤为Custom
4、同时申请js权限
理由：想美化一下自己的博客园
等待审核通过（这里很快的咯）
审核通过（可以在消息里察看）：
5、页面定制CSS代码
将下面的代码复制粘贴入即可
@keyframes spin3D{from{transform:rotate3d(0.5,0.5,0.5,360deg)}to{transform:rotate3d(0deg)}}#loading{height:100%;background-color:#1d2630;display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;overflow:hidden;z-index:99999999}.spinner-box{width:300px;height:300px;display:flex;justify-content:center;align-items:center;background-color:transparent}.leo{position:absolute;display:flex;justify-content:center;align-items:center;border-radius:50%}.blue-orbit{width:165px;height:165px;border:1px solid #91daffa5;animation:spin3D 3s linear .2s infinite}.green-orbit{width:120px;height:120px;border:1px solid #91ffbfa5;animation:spin3D 2s linear 0s infinite}.red-orbit{width:90px;height:90px;border:1px solid #ffca91a5;animation:spin3D 1s linear 0s infinite}.white-orbit{width:60px;height:60px;border:2px solid #fff;animation:spin3D 10s linear 0s infinite}.w1{transform:rotate3D(1,1,1,90deg)}.w2{transform:rotate3D(1,2,0.5,90deg)}.w3{transform:rotate3D(0.5,1,2,90deg)}
6、首页HTML代码
将下面的代码复制粘贴入即可
<div id="loading">
<div class="spinner-box">
<div class="blue-orbit leo"></div>
<div class="green-orbit leo"></div>
<div class="red-orbit leo"></div>
<div class="white-orbit w1 leo"></div>
<div class="white-orbit w2 leo"></div>
<div class="white-orbit w3 leo"></div>
</div>
</div>
7、页脚HTMl代码
将下面的代码复制粘贴入即可
<script src="https://guangzan.gitee.io/awescnb/index.js"></script>
<script>
const config = {
// 默认启用皮肤 'reacg'
// 在这里添加自定义配置
// 当前为全部使用默认配置
theme: {
name: 'reacg',
color: '#29898d',
title: 'Leebri’s Blog！',
favicon: 'https://s1.328888.xyz/2022/08/01/FqqGP.png',
avatar: 'https://pic.cnblogs.com/avatar/2937389/20220723235216.png',
headerBackground: 'https://api.mtyqx.cn/api/random.php'
},
emoji: {
enable: true,
buttonIcon: "",
emojiList: [
{
value: 'https://images.cnblogs.com/cnblogs_com/gshang/1626876/o_2001050555139.png',
label: '',
},
{
value: '',
label: '笑哭',
},
{
value: '',
label: '大笑',
},
{
value: '',
label: '苦笑',
},
{
value: '',
label: '斜眼笑',
},
{
value: '',
label: '得意',
},
{
value: '',
label: '微笑',
},
{
value: '',
label: '酷！',
},
{
value: '',
label: '花痴',
},
{
value: '',
label: '呵呵',
},
{
value: '',
label: '好崇拜哦',
},
{
value: '',
label: '思考',
},
{
value: '',
label: '白眼',
},
{
value: '',
label: '略略略',
},
{
value: '',
label: '呆住',
},
{
value: '',
label: '大哭',
},
{
value: '',
label: '头炸了',
},
{
value: '',
label: '冷汗',
},
{
value: '',
label: '吓死了',
},
{
value: '',
label: '略略略',
},
{
value: '',
label: '晕',
},
{
value: '',
label: '愤怒',
},
{
value: '',
label: '祝贺',
},
{
value: '',
label: '小丑竟是我',
},
{
value: '',
label: '嘘~',
},
{
value: '',
label: '猴',
},
{
value: '',
label: '笑笑不说话',
},
{
value: '',
label: '牛',
},
{
value: '',
label: '啤酒',
},
{
value: '(=・ω・=)',
label: '乖巧',
},
{
value: '(｀・ω・´)',
label: '啊这',
},
{
value: '(°∀°)ﾉ',
label: '震惊',
},
{
value: '←_←',
label: '鄙视',
},
{
value: '→_→',
label: '就这',
},
{
value: 'Σ(ﾟдﾟ;)',
label: '不会吧',
},
{
value: '(｡･ω･｡)',
label: '不敢动',
},
{
value: '(-_-#)',
label: '无语',
},
]
},
// 代码高亮
highLight: {
enable: true,
},
// 代码行号
lineNumbers: {
enable: true,
},
github: {
enable: true,
color: '#7775c4',
url: 'https://github.com/legical',
},
signature: {
enable: true,
contents: [
"色相事一刹那，<b style='color:#ff6b81'>光阴里无尽藏。</b>",
// "<b>console.log();</b>",
],
},
imagebox: {
enable: true,
},
darkMode: {
enable: true,
// 夜间自动切换深色模式
autoDark: true,
// 日间自动切换浅色模式
autoLight: true
},
// 背景图片或颜色
bodyBackground: {
enable: true,
value:'#1d2630',
// 'https://api.mtyqx.cn/tapi/random.php',
opacity: 0.85,
repeat: false,
},
notice:{
enable:true,
text:['双击导航条锁屏','你最最最重要','戒骄戒躁，久久为功'],
},
lock: {
enable: true,
background: '',
strings: [
'到点啦，不能再学了！',
'乖宝，休息一会儿吧~',
'离开一会，马上回来~',
'喂！三点几啦！饮茶先啦！',
],
},
live2d: {
enable: true,
page: 'all',
agent: 'pc',
model: '小埋',
width: 150,
height: 200,
position: 'left',
gap: 'default',
},
musicPlayer: {
enable: false,
},
gitee: {
enable: false,
color: '#C71D23',
url: '',
},
donation: {
enable: false,
qrcodes: [],
},
notation: {
enable: true,
},
postTopimage: {
enable: true,
imgs: ['https://s1.328888.xyz/2022/07/25/DuW9k.png',],
position: 'top',
},
indexListImg: {
enable: true,
imgs: [],
},
topProgress: {
enable: false,
page: 'all',
agent: 'pc',
background: '#29898d',
height: '5px',
},
}
$.awesCnb(config)
</script>
8、博客侧边栏公告不填
9、最后点击保存
