前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >博客园美化

博客园美化

作者头像
武培轩
发布2019-08-31 20:04:17
1.1K0
发布2019-08-31 20:04:17
举报
文章被收录于专栏:武培轩的专栏武培轩的专栏

博客园美化

对博客园美化,基于博皮“SimpleMemor”进行的修改,首先要申请js权限。

博客侧边栏公告

代码语言:javascript
复制
<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代码

代码语言:javascript
复制
<!--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-->
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-08-30 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 博客园美化
    • 博客侧边栏公告
      • 页面定制CSS代码
        • 页脚Html代码
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档