本文于2019年08月13日重新編輯。
介紹
一款專注閱讀的部落格園主題，主要面向于經常混迹 部落格園 的朋友。其追求大道至簡的終極真理，界面追求簡潔、運作追求高效、部署追求簡單。
- 開源位址
- 預覽位址
- 部署文檔
- 更新日志
特性
- :blue_heart: 簡潔優雅、精緻漂亮的 UI 設計。
- :purple_heart: 提供多種風格主題以便适應各類使用者的偏好。
- :heart: 響應式設計，相容手機端浏覽器。
- :green_heart: 提供事無巨細的部署文檔。
- :yellow_heart: 源碼結構清晰并且注釋完整，友善擴充。
開發
請先確定您正在使用的機器已經安裝 Node.js 和 Git 用戶端。
git clone https://github.com/esofar/cnblogs-theme-silence.git # 克隆源碼
cd cnblogs-theme-silence # 進入項目
npm install # 安裝依賴
npm run build # 重新建構 複制
自定義功能
如果您想要新增一些個性化的互動功能子產品，那麼您應該先修改項目
./src/silence.js
腳本檔案。您需要在該檔案中為将要新增的功能子產品添加一些新的方法，然後在入口方法
init()
中的适當位置去調用它們。該檔案代碼結構清晰、注釋完整，若您具備一定的 Javascript 開發經驗，應該可以很容易看明白，這裡就不再過多贅述。
如果您想要自定義某些元素的樣式或者是新增互動功能子產品需要添加新的樣式，那麼您應該修改項目
./src/themes/*.less
樣式檔案，
*.less
取決于您選擇應用的主題風格，您需要在該檔案中編寫自定義的樣式。在修改之前，建議您先了解 Less 的基礎用法。若您想要将自定義的樣式應用到所有主題風格，建議您直接修改項目
./src/silence.less
公共樣式檔案，不過在編寫樣式代碼的時候需要考慮各個主題風格的相容性。
完成您想做的一切後，在終端中執行
npm run build
指令重新建構項目，該指令會編譯、壓縮所有風格的樣式檔案
./src/themes/*.less
和腳本檔案
./src/silence.js
，并将結果輸出至項目
./dist
釋出目錄。
最後，參考「部署文檔」重新安裝主題即可。
新增主題風格
如果您不滿意官方提供主題風格，那麼您可以參考本節内容新增一個自己的主題風格。
首先進入項目
./src/themes
目錄，建立一個新的主題風格樣式檔案，例如：
example.less
，然後在該檔案中編寫樣式代碼即可。其代碼結構、編寫規則請參考 goddess.less 檔案。
樣式代碼編寫完成後，需要在項目工程中配置該檔案的編譯指令，具體做法如下。
打開項目
package.json
檔案，找到
scripts
節點，新增一個指令
theme-example
，用來編譯樣式檔案
example.less
：
"theme-example": "lessc ./src/themes/example.less ./dist/themes/example.min.css -clean-css", 複制
然後，在
build
建構指令中追加上述樣式檔案編譯指令
theme-example
：
... & npm run theme-example 複制
最後，在終端中執行
npm run build
指令重新建構項目，新增的主題風格
example
便會被輸出至項目
./dist
釋出目錄。
風格
簡約 · 藍
暗黑 · 綠
女神 · 粉