博客园美化记录
主题方案
整体上使用了大佬
额外配置
本人在原作者的基础上又搜罗了一些插件或脚本,实现了本博客的样式,如图所示均为额外添加的
背景渐变色
音乐播放器
主页花瓣飞舞的效果,点击查看
返回顶部的小猫
配置代码
页面定制css代码
/* 导入整体主题css */
@import "https://files.cnblogs.com/files/blogs/710456/simpleMemory.css";
/* 渐变背景 */
body {
/* background: linear-gradient(to left bottom,#b2f7ff 0,#b2d1ff 100%); */
background: linear-gradient(90deg,rgba(247,149,51,.1),rgba(243,112,85,.1) 15%,rgba(239,78,123,.1) 30%,rgba(161,102,171,.1) 44%,rgba(80,115,184,.1) 58%,rgba(16,152,173,.1) 72%,rgba(7,179,155,.1) 86%,rgba(109,186,130,.1));
}
#home{
opacity: 0.9; /*文章页透明度*/
}
/* aplayer播放器缩进 */
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body {
left: -66px !important; /* 默认情况下缩进左侧66px,只留一点箭头部分 */
}
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body:hover {
left: 0 !important; /* 鼠标悬停是左侧缩进归零,完全显示按钮 */
}
/* aplayer播放器缩进 */
博客侧边栏公告代码
<script type="text/javascript">
window.cnblogsConfig = {
info: {
name: 'aJream', // 用户名
startDate: '2021-09-17', // 入园时间,年-月-日。入园时间查看方法:鼠标停留园龄时间上,会显示入园时间
avatar: 'https://pic.cnblogs.com/avatar/2566822/20210929164658.png', // 用户头像
blogIcon: 'https://cdn.jsdelivr.net/gh/ajream/ajream.github.io/img/AJ1.png', //站点图标
},
fontIconExtend: "//at.alicdn.com/t/font_2746409_iuah9idc2x.css",
sidebar: { // 列表数据 ['导航名称', '链接', 'icon']
navList: [
['收藏', 'https://wz.cnblogs.com/my/', 'icon-shoucang'],
['个人博客', 'https://ajream.github.io', 'icon-blog'],
['Github', 'https://github.com/ajream/', 'icon-github'],
['Gitee', 'https://github.com/ajream/', 'icon-gitee2'],
['友链', 'https://www.cnblogs.com/ajream/p/15412977.html', 'icon-Link']
],
// infoBackground: 'https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220319124339_erciyaun52.jpg', // 个人信息背景
infoBackground: 'https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220320113540_info2047392.jpg',
},
banner: {
// 主页图片
home: {
background: [
"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v2.0.8/dist/images/e58d9f9d0eee6d9b9add.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123645_erciyaun6.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123703_erciyaun16.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123538_erciyaun3.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220319124420_erciyaun40.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220319124452_erciyaun31.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141605_jijianbizhi20220319_02.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141741_jijianbizhi20220319_20.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141626_jijianbizhi20220319_04.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141731_jijianbizhi20220319_14.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141653_jijianbizhi20220319_09.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120439_VuSnkygg.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120451_jijianbizhi20220320_03_2.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120459_jijianbizhi20220320_05_2.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120515_Ma3vSqEl.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120525_jijianbizhi20220320_04.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120539_jijianbizhi20220320_02_1.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120550_jijianbizhi20220320_01_1.jpg",
],
},
article: {
background: [
"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v2.0.8/dist/images/6d995b207bae4175ff28.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123645_erciyaun6.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123703_erciyaun16.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319123538_erciyaun3.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220319124420_erciyaun40.png",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2128122/o_220319124452_erciyaun31.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141605_jijianbizhi20220319_02.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141741_jijianbizhi20220319_20.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141626_jijianbizhi20220319_04.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141731_jijianbizhi20220319_14.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220319141653_jijianbizhi20220319_09.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120439_VuSnkygg.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120451_jijianbizhi20220320_03_2.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120459_jijianbizhi20220320_05_2.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120515_Ma3vSqEl.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120525_jijianbizhi20220320_04.jpg",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120539_jijianbizhi20220320_02_1.webp",
"https://images.cnblogs.com/cnblogs_com/blogs/710456/galleries/2046180/o_220320120550_jijianbizhi20220320_01_1.jpg",
],
},
},
links: {
page: [
{
name: 'aJream', // 昵称
introduction: '我的个人博客', // 简介
avatar: 'https://ajream.github.io/img/avatar2.jpg', // 头像
url: 'https://ajream.github.io' // 友链地址
},
{
name: 'BNDong', // 昵称
introduction: 'IT技术类博客', // 简介
avatar: 'https://blog.dbnuo.com/images/avatar.gif', // 头像
url: 'https://www.cnblogs.com/bndong' // 友链地址
},
{
name: '浇筑菜鸟',
avatar: 'https://gitee.com/ajream/images/raw/master/images/img/uxylxsozub_2022119131{S}308.png1642571399290.png',
url: 'https://www.cnblogs.com/jzcn/'
},
{
name: 'YJLAugus',
avatar: 'https://pic.cnblogs.com/avatar/1176586/20211228162343.png',
url: 'https://www.cnblogs.com/yjlaugus/#/c/subject/category/default.html'
},
{
name: 'Fluid',
avatar: 'https://hexo.fluid-dev.com/img/avatar.png',
url: 'https://hexo.fluid-dev.com/'
},
],
},
switchDayNight: {
enable: true,
auto: {
enable: true
}
},
//主页动态效果
animate: {
homeBanner: {
enable: false,
options: {
radius: 15,
}
},
},
//代码栏限制高度
code: {
options: {
line: true, // 显示行号
macStyle: true, //mac风格代码框
maxHeight: '70vh',
hljs: {
theme: 'atom-one-dark', //default/atom-one-dark-reasonable/qtcreator_dark/darkula/xcode(白色good)/mono-blue/monokai-sublime(好看)/atom-one-dark(good)/vs2015(good)
languages: ['Bash', 'CSS', 'Dockerfile', 'Go', 'HTML', 'HTTP']
},
},
type: 'hljs',
},
title: {
onblur: '>︿<别走,再看看呀',
onblurTime: 500, // 失去焦点延时 500ms
focus: 'q(≧▽≦q)欢迎回来!',
focusTime: 500, //获得焦点延时
},
}
</script>
<script src="https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v2.0.9/dist/simpleMemory.js" defer></script>
页首HTML代码
<script type="text/javascript" src="https://files.cnblogs.com/files/blogs/710456/returntop.js?t=1647784434"></script>
<script src="https://files.cnblogs.com/files/blogs/710456/yinghua.js?t=1647783220"></script>
<script type="text/javascript">//樱花
var system ={};
var p = navigator.platform;
system.win = p.indexOf("Win") == 0;
system.mac = p.indexOf("Mac") == 0;
system.x11 = (p == "X11") || (p.indexOf("Linux") == 0);
if(system.win||system.mac||system.xll){//如果是电脑
$.getScript("https://files.cnblogs.com/files/blogs/710456/yinghua.js?t=1647783220");
}else{ //如果是手机
}
</script>
页脚HTML代码
<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
$("body").click(function(e) {
var a = new Array("?开心?","?快乐?","?高兴?","?开心?","?快乐?","?开心?","?开心?","?开心?","?开心?","?开心?","?开心?","?开心?");
var $i = $("").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
},
1500,
function() {
$i.remove();
});
});
});
</script>
<script src="https://blog-static.cnblogs.com/files/Return-blog/xue.js"></script>
<script src="https://blog-static.cnblogs.com/files/yjlblog/cursor-effects.js"></script>
<script src="https://files.cnblogs.com/files/blogs/710456/loads.js"></script>
<script src="//cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>