設定更漂亮的部落格園主題
阿新 • • 發佈:2021-01-10
在逛部落格園的時候發現了一款特別漂亮的主題,效果圖如下,找了好久終於找到了設定的方法
效果預覽
部落格首頁樣式
部落格詳情樣式
側邊欄樣式
不得不誇讚一下作者精湛的技術,這裡為了快速上手這套面板我就挑肥揀瘦的快速過一遍教程,有意者也可以通過作者的文件進行設定,地址在結尾給出
後臺基本調整
1. 修改部落格的預設面板,所有樣式都是基於該面板進行設定的
2. 基本的設定
3. 選項頁面的調整
開始設定樣式
1. 在頁面定製 CSS 程式碼
中(注意禁用預設樣式)新增以下地址中的css程式碼:
https://github.com/BNDong/Cnblogs-Theme-SimpleMemory/blob/master/src/style/base.min.css
2. 在部落格側邊欄公告
中加入以下內容:
<script type="text/javascript"> window.cnblogsConfig = { GhVersions : 'v1.3.3', // 版本 blogUser : "部落格首頁的暱稱", // 使用者名稱 blogAvatar : "頭像的URL地址", // 使用者頭像 blogStartDate : "2020-01-01", // 入園時間,年-月-日。入園時間檢視方法:滑鼠停留園齡時間上,會顯示入園時間 } </script> <script src="https://cdn.jsdelivr.net/gh/BNDong/[email protected]/src/script/simpleMemory.min.js" defer></script>
大功告成
接下來訪問自己的部落格頁面就可以看到效果了!如果未達到目標的效果可能有哪些地方出了遺漏,可以看作者文件進行設定
原作者地址:https://bndong.github.io/Cnblogs-Theme-SimpleMemory/v1.1/#/