博客园的优化
前期准备
- 操作路径：
博客园-->我的博客-->管理-->设置--第二步 - 开通 js 权限 理由：想给自己的博客自定义些优化
- 访问 https://www.yuque.com/awescnb/user/rycpvv#c077cc06 进行对应的皮肤配置
别人家的模板
网址：https://www.yuque.com/awescnb/user/rycpvv#c077cc06
模板存底
页面定制 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 代码(后期修改主体)
<!-- @format -->
<script src="https://guangzan.gitee.io/awescnb/index.js"></script>
<script>
const opts = {
// 基本配置
theme: {
name: 'reacg',
color: '#FFB3CC',
title: '',
avatar: 'https://pic.cnblogs.com/avatar/2309168/20210723174205.png',
favicon: '',
headerBackground: 'https://api.uomg.com/api/rand.avatar',
},
// 代码高亮
highLight: {
enable: true,
},
// 代码行号
lineNumbers: {
enable: true,
},
// github图标
github: {
enable: true,
color: '#ffb3cc',
url: 'https://github.com/guangzan/awescnb',
},
// 码云图标
gitee: {
enable: false,
color: '#C71D23',
url: 'www.baidu,com',
},
// 图片灯箱
imagebox: {
enable: true,
},
// 文章目录
catalog: {
enable: true,
},
// 右下角按钮组
tools: {
enable: true,
},
// live2d模型
live2d: {
enable: true,
model: 'haru-01',
},
// 点击特效
click: {
enable: true,
},
// 评论输入框表情
emoji: {
enable: true,
},
// 暗色模式
darkMode: {
enable: true,
autoDark: false,
autoLight: false,
},
// 音乐播放器
musicPlayer: {
enable: true,
page: 'all',
agent: 'pc',
autoplay: false,
volume: 0.4,
lrc: {
enable: false, // 启用歌词
type: 1, // 1 -> 字符串歌词 3 -> url 歌词
color: '', // 颜色
},
audio: [
{
name: '一起去看风和日丽',
artist: '奚缘',
url: 'http://music.163.com/song/media/outer/url?id=1838182645.mp3',
cover: 'http://p3.music.126.net/YHzJ_fJxyLe49990VRZD9w==/109951165900596814.jpg',
lrc: `[00:00.000] 作词 : 奚缘[00:01.000] 作曲 : 奚缘[00:06.069]编曲：杨秋儒[00:10.079]录音/混音：杨秋儒[00:13.089]你说你生活很累[00:14.846]每天过得很疲惫[00:17.103]我没有感同身受所以无法对你安慰[00:20.364]不如跟我走[00:22.121]带你去兜风[00:23.626]放下那一切[00:25.381]让你所悲伤的事[00:27.387]我这人没心没肺[00:29.392]没事能将我击溃[00:31.149]我独自珍藏的快乐就已经有一大堆[00:34.157]不如相信我[00:35.910]别在意结果[00:37.665]这世界有很多的美好等待你去探索[00:41.930]转 转 转 我们转遍整个游乐园[00:44.938]看 看 看 一整天都泡在电影院[00:48.703]拍 拍 拍 拍满手机内存的相片[00:52.464]玩 玩 玩 一直不断断断[00:55.474]地去寻找 梦想和美好 能打败了烦恼 wow[00:59.490]你 说你喜欢猫 我带你去猫咖[01:02.751]爱 围绕你身边 等待你去发现[01:06.261]看 这世界 只要再多用心一点[01:09.268]只要你需要我时我都在[01:11.525]尽管在微信上call me[01:13.280]如果没接请等待[01:15.034]我肯定不是不想回你[01:16.790]相信你自己的存在[01:18.542]一定被赋予意义[01:20.296]在未来成为了人才[01:22.051]让大家都刮目相看[01:23.806]也许你生活受到阻碍[01:27.313]没有人能够了解你内心的独白[01:30.821]so what 把所有顾虑全都抛开[01:34.582]跟我一起去认识生活中的五彩[01:37.589]你说你生活很累[01:39.595]每天过得很疲惫[01:40.852]我没有感同身受所以无法对你安慰[01:44.614]不如跟我走[01:46.119]带你去兜风[01:47.874]放下那一切[01:49.883]让你所悲伤的事[01:51.637]我这人没心没肺[01:53.140]没事能将我击溃[01:54.894]我独自珍藏的快乐就已经有一大堆[01:58.406]不如相信我[02:00.412]别在意结果[02:02.917]这世界有很多的美好等待你去探索[02:06.178]yeah 欢迎你闯入我的世界[02:09.442]uh 你可以随便对他装点[02:13.455]hey 我摘下星星为你营业[02:16.718]你所有心愿[02:18.476]他都能实现`,
},
],
},
// 随笔头图
postTopimage: {
enable: true,
},
// 随笔尾图
postBottomimage: {
enable: false,
},
// 打赏二维码
donation: {
enable: false,
qrcodes: [],
},
// 个性签名
signature: {
enable: false,
contents: [],
},
// 侧边栏二维码
qrcode: {
enable: false,
img: '',
desc: '',
},
// 弹出公告
notice: {
enable: false,
text: [],
},
// 首页列表图
indexListImg: {
enable: true,
},
// 顶部加载进度条
topProgress: {
enable: false,
},
// 随笔页尾部签名
postSignature: {
enable: true,
content: [],
licenseName: '',
licenseLink: '',
},
// 背景图片或颜色
bodyBackground: {
enable: false,
value: '',
opacity: 0.9,
repeat: false,
},
// 弹幕
barrage: {
enable: false,
},
// 图表
charts: {
enable: false,
},
// 锁屏
lock: {
enable: true,
},
// 自定义链接链接
links: [
{
name: 'CSDN社区',
link: 'https://www.csdn.net/',
},
],
}
$.awesCnb(opts)
</script>