【博客园】博皮美化

一，主题美化

Git地址：https://github.com/BNDong/Cnblogs-Theme-SimpleMemory

1，选择SimpleMemory皮肤
2，在"页面定制 CSS 代码 "处，粘贴base.min.css内容
3，在"博客侧边栏公告（支持HTML代码） （支持 JS 代码） "处，添加配置文件

<script type="text/javascript">
    window.cnblogsConfig = {
        GhVersions    : 'v1.3.3', // 版本
        blogUser      : "userName", // 用户名
        blogAvatar    : "https://img-blog.csdnimg.cn/20201130104455736.jpg", // 用户头像
        blogStartDate : "2020-12-02", // 入园时间，年-月-日。入园时间查看方法：鼠标停留园龄时间上，会显示入园时间
        menuUserInfoBgImg: 'https://img-blog.csdnimg.cn/20201130104459702.png', 
        webpageTitleOnblur: 'STHXN', //当页面失去焦点，页面title显示的文字
        webpageTitleFocus: '欢迎回来', //当页面获取焦点，页面title显示的文字
        webpageIcon: "https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/blog_logo.webp",//网站图标
	    switchDayNight: {
	         enable: true,// 是否开启日/夜间模式切换按钮
	         auto: {
	             enable: true //若配置为true则自动切换
		          //enable: false,  // 开启自动切换
		          //dayHour: 5,     // 日间模式开始时间，整数型，24小时制
		          //nightHour: 19   // 夜间模式开始时间，整数型，24小时制
	         }
	    },
   		homeBannerText: "好好学习，天天向上！",
		homeBannerTextType: "one",    //one为每日一句话，若采用homBannerText自己设置，则显示自己设置标语优先显示
//jinrishici：每次刷新随机获取一句古诗词。

	     codeImgUrl   : '', // 左侧图片设置，不配置使用 window.cnblogsConfig.blogAvatar
	     aboutHtml    : '', // 关于博主，不配置使用默认
	     copyrightHtml: '', // 版权声明，不配置使用默认
	     supportHtml  : '', // 声援博主，不配置使用默认
	     enable: false, // 是否开启打赏功能
	     wechatpay: '', // 微信支付二维码图片URL
	     alipay: '', // 支付宝支付二维码图片URL
		 footerStyle: 2,   //页脚样式1 or 2
	     bottomText: {
	         icon: "❤️",
	         left : "",
	         right: "",
	     },

	     homeTopImg: [//主页图片
	        //"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/home_top_bg.webp", //url地址可以自行添加
	        //"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/home_top_bg.webp"
	     ],
     	 essayTopImg: [//文章图片
         	//"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/nothome_top_bg.webp",//url地址可自行添加
         	//"https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/nothome_top_bg.webp"
    	 ],
         menuNavList: [                                
            ['CSDN', 'https://blog.csdn.net/qq_36036735']
                  
         ],
	     bottomBlogroll: [ // 友情链接，[[链接名,链接]....]
	         ["申请坑位", 'https://msg.cnblogs.com/send/BNDong'],
	         ["申请坑位", 'https://msg.cnblogs.com/send/BNDong'],
	         ["申请坑位", 'https://msg.cnblogs.com/send/BNDong'],
	         ["申请坑位", 'https://msg.cnblogs.com/send/BNDong'],
	         ["申请坑位", 'https://msg.cnblogs.com/send/BNDong'],
	     ]
    }
</script>
<script src="https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@1.3.3/src/script/simpleMemory.min.js"></script>

二，添加宠物人偶

Git地址： https://github.com/EYHN/hexo-helper-live2d

1，css设置

/*live2d虚线处理*/
canvas#live2dcanvas {
    border: 0 !important; //可避免虚线问题
}

2，js设置

<script type="text/javascript" charset="utf-8" async="" src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>

3，在"页脚 HTML 代码"处，添加配置文件

<script type="text/javascript">
setTimeout(() => {
   L2Dwidget.init({
       "model": {
               "jsonPath": "https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json",//更换角色
               "scale": 0.7
       },
       "display": {
               "position": "right",
               "width": 110,
               "height": 70,
               "hOffset": 0,
               "vOffset": -00
       },
       "mobile": {
               "show": true,
               "scale": 0.5
       },
       "react": {
               "opacityDefault": 0.7,
               "opacityOnHover": 0.7
       }
   });
}, 1000)
</script>

三，添加文章目录

在"首页HTML代码"处，添加配置

<link href="http://files.cnblogs.com/files/sthxn/cnblog-scroller.css" type="text/css" rel="stylesheet">
<script src="http://files.cnblogs.com/files/sthxn/scrollspy.js" type="text/javascript"></script>
<script src="http://files.cnblogs.com/files/sthxn/stickUp.min.js" type="text/javascript"></script>
<script src="https://blog-static.cnblogs.com/files/sthxn/cnbolg-scrollspy.js" type="text/javascript"></script>