介紹
??一款專注閱讀的博客園主題，主要面向于經常混跡 博客園 的朋友，其追求大道至簡的終極真理，界面追求簡潔、運行追求高效、部署追求簡單，
- 博客皮膚原始碼地址
- 預覽地址
- 如何部署、使用皮膚
- Silence作者的友鏈
特點
- 簡潔優雅、精致漂亮的 UI 設計
- 提供多種風格主題以便適應各類用戶的偏好
- 回應式設計，兼容手機端瀏覽器
- 提供事無巨細的部署檔案
- 原始碼結構清晰并且注釋完整，方便擴展
開發
??請先確保您正在使用的機器已經安裝 Node.js 和 Git 客戶端，
git clone https://github.com/esofar/cnblogs-theme-silence.git # 克隆原始碼
cd cnblogs-theme-silence # 進入專案
npm install # 安裝依賴
npm run build
??如果沒有安裝node，js或者不會使用的童鞋可以在我的GitHub，也就是博客皮膚原始碼地址中，
部署
??重點部署之前使用博客園的cutorm皮膚，具體部署細節請詳見'如何部署、使用皮膚'，如果又不會的話可以看一看我的配置作為參考（僅作為參考，找不回來別哭鼻子）
CSS
<!-- 溢位隱藏設定（放置在管理--> 設定--> css模塊中） -->
#topics, #mainContent {
overflow: visible;
}
.cnblogs-markdown .hljs{
display:block;
color:#333;
overflow-x:auto;
background:#F2F4F5!important;
border:none!important;
font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace!important;
padding:1em!important;
font-size:14px!important
}
側邊欄公告
<!-- 在管理--> 設定-> 側邊欄公告(支持js代碼、支持html代碼) -->
<script src=https://www.cnblogs.com/glassysky/p/"https://blog-static.cnblogs.com/files/glassysky/silence.min.js"></script>
<script type="text/javascript">
$.silence({
profile: {
enable: true,
avatar:'https://gitee.com/glassyskyforgame/glassysky/blob/master/4c67d1a20cf431ade2873e284836acaf2fdd989e.jpg',
favicon: 'https://gitee.com/glassyskyforgame/glassysky/raw/master/4c67d1a20cf431ade2873e284836acaf2fdd989e.jpg',
},
catalog: {
enable: true,
move: true,
index: true,
level1: 'h2',
level2: 'h3',
level3: 'h4',
},
signature: {
enable: true,
home: 'https://www.cnblogs.com/glassysky/',
license: '署名 4.0 國際',
link: 'https://creativecommons.org/licenses/by/4.0'
},
reward: {
enable: true,
title: '感謝小可愛投食',
wechat: 'https://images.cnblogs.com/cnblogs_com/esofar/972540/o_wechat.png',
alipay: 'https://images.cnblogs.com/cnblogs_com/esofar/972540/o_alipay.png'
},
github: {
enable: true,
color: '#fff',
fill: null,
link: 'https://github.com/glassy-sky-lisong'
}
});
</script>
<!--外置主題css補丁-->
<link rel="stylesheet" type="text/css" href=https://www.cnblogs.com/glassysky/p/"https://blog-static.cnblogs.com/files/glassysky/sli.css"/>
會動的title
<!-- 動態titlejs -->
<script> var OriginTitle = document.title; var titleTime; document.addEventListener('visibilitychange', function () { if
(document.hidden) { document.title = '╭(°A°`)╮ 頁面崩潰啦 ~'; clearTimeout(titleTime); } else { document.title = '(?>ω<*?) 噫又
好了~' + OriginTitle; titleTime = setTimeout(function () { document.title = OriginTitle; }, 2000); } }); </script>
圖片放大功能
<!--圖片放大的zoomcss和js-->
<link rel="stylesheet" type="text/css" href=https://www.cnblogs.com/glassysky/p/"https://blog-static.cnblogs.com/files/glassysky/zoom.css"/>
<script src="https://blog-static.cnblogs.com/files/glassysky/zoom.js"></script>
<script type="text/javascript">$('#cnblogs_post_body img').attr('data-action', 'zoom');</script>
博客的皮膚風格
- 簡約·藍
- 暗黑·綠
- 女神·粉
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/49622.html
標籤：其他
上一篇：很高興來到博客園，感謝管理員
下一篇：常見的Dos命令大全