2020终于要过去了,给博客园更换一个新皮肤,2021年新年新气象。
Silence:https://esofar.github.io/cnblogs-theme-silence/#/?id=cnblogs-theme-silence
专 注 于 阅 读 的 博 客 园 主 题
备份下原来基于SimpleMemory主题 + 部分定制化的代码。包含回到top、文章自动生成目录的功能。
1. 页面定制CSS代码
/*推荐栏固定到右下角*/ /* #div_digg{ position: fixed; bottom: 5px; width: 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://www.icode9.com/i/i/?n=18&i=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>