博客园美化
博客园美化
对博客园美化，基于博皮“SimpleMemor”进行的修改，首先要申请js权限。
博客侧边栏公告
<script type="text/javascript">
console.log=function(){};
window.cnblogsConfig = {
GhVersions : 'v1.1.5.1', // 版本
blogUser : "武培轩", // 用户名
blogAvatar : "https://pic.cnblogs.com/avatar/1356806/20180320195124.png",
blogStartDate : "2018-3-20", // 入园时间，年-月-日。入园时间查看方法：鼠标停留园龄时间上，会显示入园时间,
webpageIcon: "https://files-cdn.cnblogs.com/files/wupeixuan/blog_logo.gif",
fontIconExtend: "//at.alicdn.com/t/font_543384_ezv3l7gd9r7.css",
//主页banner图片
homeTopImg: [
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-4ylgl0.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-ne7lr8.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-xl67ov.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-neqwon.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-lm2762.jpg",
],
//侧边栏
menuUserInfoBgImg: 'https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_menu_bg.gif',
//文章页配置
essayTopImg: [
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-d5yzvg.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-4d38m0.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-4gj334.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-j82g35.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-r2yjg1.jpg",
"https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wallhaven-wymo2p.jpg",
],
// ---- 页面动效配置 ----
homeTopAnimationRendered: true, // true || false ,是否渲染主页头图动效
homeTopAnimation: { // 主页头图动效设置
radius: 15,
density: 0.2,
color: 'rgba(255,255,255, .2)', // 颜色设置，“random” 为随机颜色
clearOffset: 0.3
},
essayTopAnimationRendered: true, // true || false ,是否渲染随笔页头图动效
essayTopAnimation: { // 随笔页头图动效设置
triW : 14,
triH : 20,
neighbours : ["side", "top", "bottom"],
speedTrailAppear : .1,
speedTrailDisappear : .1,
speedTriOpen : 1,
trailMaxLength : 30,
trailIntervalCreation : 100,
delayBeforeDisappear : 2,
colors: [
'#96EDA6', '#5BC6A9',
'#38668C', '#374D84',
'#BED5CB', '#62ADC6',
'#8EE5DE', '#304E7B'
]
},
bgAnimationRendered: true, // true || false ,是否渲染背景动效
backgroundAnimation : { // 背景动效设置
colorSaturation: "60%",
colorBrightness: "50%",
colorAlpha: 0.5,
colorCycleSpeed: 5,
verticalPosition: "random",
horizontalSpeed: 200,
ribbonCount: 3,
strokeSize: 0,
parallaxAmount: -0.2,
animateSections: true
},
homeBannerTextType: "one",
//代码高亮配置
essayCodeHighlightingType: 'highlightjs', // 代码主题插件类型：cnblogs || highlightjs || prettify
essayCodeHighlighting: 'idea', // 代码高亮主题，具体主题参考文档
//页脚标语
bottomText: {
left : "既然选择了远方",
right: "便只顾风雨兼程"
},
//文章后缀配置
essaySuffix: {
codeImgUrl : 'https://images.cnblogs.com/cnblogs_com/wupeixuan/1186798/o_wechat.png', // >= v1.1.5 左侧图片设置，不配置使用 window.cnblogsConfig.blogAvatar
aboutHtml : '敲代码，健身，读书。', // 关于博主，不配置使用默认
copyrightHtml: '本文为博主原创文章，转载请注明出处。', // 版权声明，不配置使用默认
supportHtml : '' // 声援博主，不配置使用默认
}
}
</script>
<script src="https://blog-static.cnblogs.com/files/wupeixuan/simpleMemory.min.js"></script>
<script src="https://blog-static.cnblogs.com/files/wupeixuan/mouse-click.js"></script>
<canvas width="1777" height="841" style="position: fixed; left: 0px; top: 0px; z-index: 2147483647; pointer-events: none;"></canvas>
页面定制CSS代码
页脚Html代码
<!--live2d-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Live2D</title>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/wupeixuan/waifu.css"/>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/wupeixuan/flat-ui.min1.css"/>
</head>
<body>
<div class="waifu" id="waifu">
<div class="waifu-tips" style="opacity: 1; font-size: 14px"></div>
<canvas id="live2d" width="300" height="300" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>
<script src="https://blog-static.cnblogs.com/files/wupeixuan/live2d.js"></script>
<script src="https://blog-static.cnblogs.com/files/wupeixuan/waifu-tips1.js"></script>
<script type="text/javascript">initModel()</script>
</body>
</html>
<!--live2dend-->
