Hexo部落格多臺電腦裝置同步管理

RunTitan發表於2018-04-12
Hexo

一. 個性化配置

1. 返回頂部按鈕顯示滾動進度

  • 開啟主題配置檔案 ~themes/next/_config.yml 找到sidebar欄位
  • 把scrollpercent的屬性改為true即可, 如下:
sidebar:
# Sidebar Position - 側欄位置（只對Pisces | Gemini兩種風格有效）
  position: left        //靠左放置
  #position: right      //靠右放置

# Sidebar Display - 側欄顯示時機（只對Muse | Mist兩種風格有效）
  #display: post        //預設行為，在文章頁面（擁有目錄列表）時顯示
  display: always       //在所有頁面中都顯示
  #display: hide        //在所有頁面中都隱藏（可以手動展開）
  #display: remove      //完全移除

  offset: 12            //文章間距（只對Pisces | Gemini兩種風格有效）

  b2t: false            //返回頂部按鈕（只對Pisces | Gemini兩種風格有效）

  scrollpercent: true   //返回頂部按鈕的百分比
複製程式碼

二. 多裝置管理部落格

正常情況下, 我們部落格的相關配置資訊都是在本地的, 並未上傳伺服器, 這樣當我們想在其他裝置, 比如公司的電腦或者原電腦重灌了系統, 那麼我們便無法再維護我們的部落格了

1. 環境配置

2. 建立分支

  • hexo生成的靜態部落格檔案都是上傳到GitHub上的, 且預設放在master分支上, 而一些相關的配置檔案都在本地
  • hexo的原始檔（部署環境檔案）可以都放在hexo分支上（可以新建立一個hexo分支），換新電腦時，直接git clone hexo分支

2-1. 對username.github.io倉庫新建hexo分支

在Github的username.github.io倉庫上新建一個hexo(分支名字可自定義)分支, 在下圖箭頭位置輸入分支名字,回車即可建立成功

GitHub新建分支.png

2-2. 設定預設分支

切換到該hexo分支，並在該倉庫->Settings->Branches->Default branch中將預設分支設為hexo，save儲存

設定預設分支

3. 配置檔案上傳導Github

該步驟需要在搭建部落格的電腦上操作(部落格配置檔案和主題配置檔案所在的電腦上操作)

3-1. 克隆hexo分支

  • 將上述新建的hexo分支克隆到本地, 在終端中cd進入該username.github.io檔案目錄
  • 在當前目錄使用Git Bash執行git branch命令檢視當前所在分支，應為新建的分支hexo
  • 如果用Sourcetree軟體管理程式碼的話, 克隆到本地的專案可能沒有username.github.io層級, 所有檔案都在根目錄下, 操作上都不影響, 只需要記住操作要在檔案的根目錄下即可
$ git branch
*hexo
複製程式碼

3-2. 上傳部署檔案

  • 先將本地部落格的部署檔案（Hexo目錄下的全部檔案）全部拷貝進username.github.io檔案目錄中去
  • 然後安裝要用到的一些外掛, 有的可能不需要, 但都安裝了貌似沒有任何影響
npm install hexo-generator-index --save
npm install hexo-generator-archive --save
npm install hexo-generator-category --save
npm install hexo-generator-tag --save
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-deployer-heroku --save
npm install hexo-deployer-rsync --save
npm install hexo-deployer-openshift --save
npm install hexo-renderer-marked@0.2 --save
npm install hexo-renderer-stylus@0.2 --save
npm install hexo-generator-feed@1 --save
npm install hexo-generator-sitemap@1 --save
npm install hexo-generator-search --save
npm install hexo-generator-searchdb --save
複製程式碼
  • 最後就是講所有的檔案都提交到hexo分支
  • 提交時考慮以下注意事項
    • 將themes目錄以內中的主題的.git目錄刪除（如果有），因為一個git倉庫中不能包含另一個git倉庫，否則提交主題資料夾會失敗
    • 後期需要更新主題時在另一個地方git clone下來該主題的最新版本，然後將內容拷到當前主題目錄即可
  • 最後用終端或者管理工具將所有檔案提交到hexo分支

master分支和hexo分支各自儲存著一個版本，master分支用於儲存部落格靜態資源，提供部落格頁面供人訪問；hexo分支用於備份部落格部署檔案，供自己維護更新，兩者在一個GitHub倉庫內也不會有任何衝突

4. 同步到其他電腦

  • 將新電腦的生成的ssh key新增到GitHub賬戶上
  • 在新電腦上克隆username.github.io倉庫的hexo分支到本地，此時本地git倉庫處於hexo分支
  • 切換到username.github.io目錄，執行npm install(由於倉庫有一個.gitignore檔案，裡面預設是忽略掉 node_modules資料夾的，也就是說倉庫的hexo分支並沒有儲存該目錄，所以需要install下)
    • 如果node_modules檔案沒有丟失, 可不執行該操作
  • 到這裡了就可以開始在自己的電腦上寫部落格了！
  • 需要注意的是每次更新部落格之後, 都要把相關修改上傳到hexo分支
  • 每次換電腦更新部落格的時候, 在修改之前最好也要git pull拉取一下最新的更新

說到這裡所有的相關問題基本也都解決了

相關文章