博客園美化

博客園美化

對博客園美化，基於博皮「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代碼

頁面定製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-->