找文章,發現 https://www.cnblogs.com/zhaoqingqing 的部落格樣式很好, 在底部發現是基於Theme Silence v2.0.2,現在坐著已經更新到v3.0.0-rc2, 作者GitHub:https://github.com/esofar/cnblogs-theme-silence ,自己做了一些小修改。
基本可以配置出差不多的,可以參考我的配置:
<script>
window.$silence = {
avatar: 'https://images.cnblogs.com/cnblogs_com/LungGiyo/2432949/o_241123065246_o_avatar.jpg',
//favicon: 'https://files.cnblogs.com/files/esofar/favicon.ico',
github: 'https://github.com/aikunzhe',
defaultMode: 'auto',
defaultTheme: 'e',
navbars: [
{
title: '程式語言',
children: [
{
title: 'C#和.NET',
url: 'https://www.cnblogs.com/zhaoqingqing/category/527577.html',
},
{
title: 'Java語言',
url: 'https://www.cnblogs.com/zhaoqingqing/category/1278231.html',
},
{
title: 'C和C++',
url: 'https://www.cnblogs.com/zhaoqingqing/category/556352.html',
},
{
title: 'Lua/Js/Shell...',
url: 'https://www.cnblogs.com/zhaoqingqing/category/750410.html',
},
{
title: 'Python語言',
url: 'https://www.cnblogs.com/zhaoqingqing/category/2016077.html',
},
{
title: '組合語言',
url: 'https://www.cnblogs.com/zhaoqingqing/category/584461.html',
},
]
},
{
title: '遊戲程式設計',
children: [
{
title: 'Cocos2d-x',
url: 'https://www.cnblogs.com/zhaoqingqing/category/554286.html',
},
{
title: 'uGUI/Unity2D',
url: 'https://www.cnblogs.com/zhaoqingqing/category/563344.html',
},
{
title: 'NGUI/UI開發',
url: 'https://www.cnblogs.com/zhaoqingqing/category/835738.html',
},
{
title: 'Unity3D外掛開發',
url: 'https://www.cnblogs.com/zhaoqingqing/category/555471.html',
},
{
title: 'VR/AR 技術',
url: 'https://www.cnblogs.com/zhaoqingqing/category/835025.html',
},
{
title: 'Unity3D專案開發',
url: 'https://www.cnblogs.com/zhaoqingqing/category/537262.html',
},
{
title: 'Unity3D經驗技巧',
url: 'https://www.cnblogs.com/zhaoqingqing/category/514068.html',
},
{
title: 'Unity3D Editor開發',
url: 'https://www.cnblogs.com/zhaoqingqing/category/529305.html',
},
{
title: '自研引擎及專案開發',
url: 'https://www.cnblogs.com/zhaoqingqing/category/2016213.html',
},
]
},
{
title: '更多內容',
children: [
{
title: '關於我',
url: 'https://www.cnblogs.com/zhaoqingqing/p/about.html',
},
{
title: '圖形學',
url: 'https://www.cnblogs.com/zhaoqingqing/category/623959.html',
},
{
title: '我的隨筆',
url: 'https://www.cnblogs.com/zhaoqingqing/category/541042.html',
},
{
title: "文章歸檔",
url:"https://www.cnblogs.com/zhaoqingqing/p",
},
{
title: '資料結構與演算法',
url: 'https://www.cnblogs.com/zhaoqingqing/category/610625.html',
},
]
},
{
title: '後臺管理',
children: [
{
title: '部落格管理',
url: 'https://i.cnblogs.com/settings',
},
{
title: '新建文章',
url: 'https://i.cnblogs.com/posts/edit',
},
{
title: '友情連結',
url: 'https://www.cnblogs.com/zhaoqingqing/p/link.html',
},
{
title:"我的動態",
url:"https://home.cnblogs.com/u/zhaoqingqing/",
},
]
},
],
showNavAdmin: false,
catalog: {
enable: true,
index: true,
active: true,
levels: ['h2', 'h3', 'h4'],
},
signature: {
enable: false,
author: 'Tiny',
license: ['署名-非商業性使用-相同方式共享 4.0 國際', 'https://creativecommons.org/licenses/by-nc-sa/4.0/'],
},
sponsor: {
enable: true,
text: '如果你覺得文章有用,可以請我喝咖啡☕.',
wechat: 'https://images.cnblogs.com/cnblogs_com/esofar/972540/o_wechat.png',
alipay: 'https://images.cnblogs.com/cnblogs_com/esofar/972540/o_alipay.png'
}
};
</script>
去掉導航欄控制元件
https://i.cnblogs.com/preference
增加自定義公告內容
效果:
新增CSS樣式:
新增HTML程式碼:
<script>
$(function()
{
/*增加公告*/
var notice = ` <div id='SiteContent'>\
<p>不積跬步,無以至千里;<br/>不積小流,無以成江海。</p><br />\
<ul>\
<li><a href='http://wpa.qq.com/msgrd?v=3&uin=569032731&site=qq&menu=yes' target='_blank'>QQ 聯絡</a></li>\
<li><a style='text-decoration: none' href='http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=wLqooa_xqa6nsamup-LygLGx7qOvrQ' target='_blank'>郵件聯絡</a></li>\
<li><a href='https://github.com/zhaoqingqing' target='_blank'>我的GitHub</a></li>\
<li><a href='https://zhaoqingqing.github.io/' target='_blank'>Git Blog</a></li>\
<li><a href='https://www.zhihu.com/people/zhaoqingqing' target='_blank'>我在知乎</a></li>\
<li><a href='https://www.cnblogs.com/zhaoqingqing/rss' target='_blank'>Rss訂閱</a></li>\
<li><a href='https://space.cnblogs.com/msg/send/zhaoqingqing' target='_blank'>站內訊息</a></li>\
<li><a href='https://www.cnblogs.com/zhaoqingqing/p/about.html' target='_blank'>我的資料</a></li>\
<li><a href='https://www.cnblogs.com/cate/gamedev/' target='_blank'>園內遊戲類</a></li>\
<li><a href='https://www.cnblogs.com/zhaoqingqing/p/link.html' target='_blank'>友情連結</a></li>\
</ul>\
</div>`
$("#sidebar_news").append(notice);
})
</script>
為文章設定過期提示
這裡使用的效果,是基於cnblogs-theme-silence 的,具體效果如下:
新增HTML程式碼
/*為文章設定過期提示*/
var start = new Date($("#post-date").attr("data-date-updated")).getTime();
var end=new Date().getTime();
var num =((end-start)/(1000*60*60*24)).toFixed(0);//總計時數
if(num>30)$(".postTitle").after('<div class="esa-post-signature"> <p>本文最後更新釋出於' + " " + num + " " + '天前,部分資訊可能有時效性,請謹慎參考本文內容。請在下方<a href="#commentform_title"><b>留言</b></a>或聯絡我</p></div>');
部落格園滑鼠特效
作者GitHub: https://github.com/shuiche-it/cnblog-mouse
效果:
新增HTML程式碼:
<script src="https://blog-static.cnblogs.com/files/xuange306/mouse.min.js"></script>
<script type="text/javascript">
$.shuicheMouse({
type:11,
color:false
})
</script>