我的博客园的定制化配置v20201229

2020终于要过去了，给博客园更换一个新皮肤，2021年新年新气象。

Silence：https://esofar.github.io/cnblogs-theme-silence/#/?id=cnblogs-theme-silence

专 注 于 阅 读 的 博 客 园 主 题

备份下原来基于SimpleMemory主题 + 部分定制化的代码。包含回到top、文章自动生成目录的功能。

1. 页面定制CSS代码

/*推荐栏固定到右下角*/
/*
#div_digg{
    position: fixed;
    bottom: 5px;
     136px;
    right: 0px;
    border: 2px solid #29b0ec;
    padding: 10px;
    background-color: #fff;
    border-radius: 5px 5px 5px 5px !important;
    box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
}
*/
/*推荐加边框*/
/*
.diggit{
border: 4px solid rgba(54, 113, 165, 0.37);
}
*/

/*禁用广告*/
#bannerbar{
    display:none; !important
}

/*标题h1,h2,h3*/
#cnblogs_post_body h1 {
    background: none repeat scroll 0% 0% rgba(212, 230, 245, 0.8);
    border-radius: 6px 6px 6px 6px;
    /* box-shadow: 0px 0px 0px 1px rgb(95, 90, 75), 1px 1px 6px 1px rgba(10, 10, 0, 0.5); */
    color: #333;
    font-family: "微软雅黑","宋体","黑体",Arial;
    font-size: 17px;
    font-weight: bold;
    height: 25px;
    line-height: 25px;
    margin: 15px 0px !important;
    padding: 5px 0px 5px 20px;
    /* text-shadow: 2px 2px 3px rgb(34, 34, 34); */
    width: 98%;
}
#cnblogs_post_body h1 a{
   color: rgb(235, 235, 235);
}
#cnblogs_post_body h1 a:hover{
   color: rgb(255, 102, 0);
}


#cnblogs_post_body h2 {
    background: none repeat scroll 0% 0% #E0F9E0;
    border-radius: 6px 6px 6px 6px;
    /* box-shadow: 0px 0px 0px 1px rgb(95, 90, 75), 1px 1px 6px 1px rgba(10, 10, 0, 0.5); */
    color: #333;
    font-family: "微软雅黑","宋体","黑体",Arial;
    font-size: 15px;
    font-weight: bold;
    height: 21px;
    line-height: 21px;
    margin: 15px 0px !important;
    padding: 5px 0px 5px 20px;
    /* text-shadow: 2px 2px 3px rgb(34, 34, 34); */
    width: 98%;
}
#cnblogs_post_body h2 a{
   color: rgb(235, 235, 235);
}
#cnblogs_post_body h2 a:hover{
   color: rgb(255, 102, 0);
}

#cnblogs_post_body h3 {
    background: none repeat scroll 0% 0% rgb(255, 249, 224);
    border-radius: 6px 6px 6px 6px;
    /* box-shadow: 0px 0px 0px 1px rgb(95, 90, 75), 1px 1px 6px 1px rgba(10, 10, 0, 0.5); */
    color: #333;
    font-family: "微软雅黑","宋体","黑体",Arial;
    font-size: 13px;
    font-weight: bold;
    height: 15px;
    line-height: 13px;
    margin: 15px 0px !important;
    padding: 5px 0px 5px 20px;
    /* text-shadow: 2px 2px 3px rgb(34, 34, 34); */
    width: 98%;
}
#cnblogs_post_body h3 a{
   color: rgb(235, 235, 235);
}
#cnblogs_post_body h3 a:hover{
   color: rgb(255, 102, 0);
}

#back-top span {
    width: 50px;
    height: 64px;
    display: block;
    background: url(https://images2018.cnblogs.com/blog/859549/201805/859549-20180503142313612-1617999836.png) no-repeat center center;
}
/*返回顶部*/
#back-top {
    position: fixed;
    bottom: 120px;
    right: 120px;
    z-index: 99;
}

2. 博客侧边栏公告（支持HTML代码） （支持 JS 代码）

<img src="https://files-cdn.cnblogs.com/files/yeahwell/fenshu-mini-8cm.bmp" width="150px" height="150px"><br>
<b style="color:red;">分书</b>↑↑↑扫描二维码<br>穿过虫洞来看我

3. 页首 HTML 代码

<script>
function addNag(linkName,linkHref,linkLocation){
                //获得导航DOM对象
                var _navigator = document.getElementById("navList");
                //创建导航无序列表中的li
                var _link = document.createElement("li");
                var _a = document.createElement("a");
                _a.class="menu";
                _a.href= linkHref;
                _a.target = "_blank";
                var _text = document.createTextNode(linkName);
                _a.appendChild(_text);
                _link.appendChild(_a);
                //添加至指定的位置
                var _lis = _navigator.getElementsByTagName("li");
                if(linkLocation > _lis.length && linkLocation > 0){
                    _navigator.appendChild(_link);
                }else{
                    _navigator.insertBefore(_link,_lis[linkLocation-1]);
                }
            }

addNag("抖带货导航","https://daohang.doudaihuo.com/",7);
</script>

4. 页脚 HTML 代码

    <div id="page_end_html">
<script language="javascript" type="text/javascript">
//生成目录索引列表
function GenerateContentList()
{
    var jquery_h3_list = $('#cnblogs_post_body h1');//如果你的章节标题不是h3,只需要将这里的h3换掉即可
    if(jquery_h3_list.length>0)
    {
        var content = '<a name="_labelTop"></a>';
        content    += '<div id="navCategory">';
        content    += '<p style="font-size:18px"><b>阅读目录</b></p>';
        content    += '<ul>';
        for(var i =0;i<jquery_h3_list.length;i++)
        {
            var go_to_top = '<div style="text-align: right"><a href="#_labelTop">回到顶部</a><a name="_label' + i + '"></a></div>';
            $(jquery_h3_list[i]).before(go_to_top);
            var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
            content += li_content;
        }
        content    += '</ul>';
        content    += '</div>';
        if($('#cnblogs_post_body').length != 0 )
        {
            $($('#cnblogs_post_body')[0]).prepend(content);
        }
    }    
}
GenerateContentList();
</script>

<script type="text/javascript">
$(function() {
    // hide #back-top first
    $("#back-top").hide();
    // fade in #back-top
    $(window).scroll(function() {
        if ($(this).scrollTop() > 400) {
            $('#back-top').fadeIn();
        } else {
            $('#back-top').fadeOut();
        }
    });
    // scroll body to 0px on click
    $('#back-top a').click(function() {
        $('body,html').animate({
            scrollTop: 0
        }, 500);
        return false;
    });
});
</script>
<p id="back-top" style="display:none"><a href="#top"><span></span></a></p>
    </div>

<center>
<script type="text/javascript">document.write(unescape("%3Cspan id='cnzz_stat_icon_1279228697'%3E%3C/span%3E%3Cscript src='https://v1.cnzz.com/z_stat.php%3Fid%3D1279228697%26online%3D1%26show%3Dline' type='text/javascript'%3E%3C/script%3E"));</script>
</center>