原來發(fā)了一個關于Hexo搭建博客系列的總綱报亩,想要搭建個人博客的同學章蚣,建議直接根據官方文檔(https://hexo.io/zh-cn/docs/)搭建博客推励,本文針對Windows系統(tǒng)補充講解一些個人設置父晶。
Hexo是一個開源的博客框架曲梗,是一位臺灣小哥(tommy351)在大學時開發(fā)出來的赞警。我們可以直接基于這個框架,選擇一個自己喜歡的主題虏两,修改一些配置愧旦,就搭建出一個博客了。我使用的是NexT主題定罢,最終效果可看我的博客:https://depp.wang
笤虫。個人博客是也通過Jekyll和WordPress搭建,但是Hexo簡單免費祖凫,建議使用Hexo琼蚯。
Hexo搭建的博客是靜態(tài)的,沒有后臺代碼惠况,所以速度很快遭庶。
安裝Git+NodeJS環(huán)境
Hexo是基于Node.js的靜態(tài)博客生成器,所有需要提前安裝Node.js稠屠,可使用命令行下載(詳見官方文檔教程)峦睡,最好下載長期維護版,地址:
https://nodejs.org/zh-cn/
Hexo是在本地使用MarkDown語法寫博客完箩,再使用Git發(fā)布到遠程代碼托管平臺上赐俗,如GitHub。
需要安裝Git弊知,一個代碼管理工具阻逮。以下所有命令均是在Git Bash(Git命令行窗口)中執(zhí)行的。下載地址:
https://git-scm.com/downloads //官方地址秩彤,速度應該比較慢
https://github.com/waylau/git-for-win //github下載地址
推薦一個廖雪峰大神的Git經典入門教程叔扼,講得非常好事哭,學完肯定對git原理了然于胸。
http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000
Hexo配置使用
Hexo安裝
當Node.js安裝完畢后瓜富,在任意文件夾鼠標右擊選擇Git Bash Here打開Git命令行鳍咱,執(zhí)行如下命令安裝Hexo:
$ npm install -g hexo-cli
初始化博客
新建一個文件夾(如E:\Hexo,以下教程都以這個目錄為博客根目錄)与柑,在博客根目錄下點擊鼠標右鍵谤辜,選擇Git Bash Here
,執(zhí)行如下命令价捧,如果以下命令執(zhí)行失敗丑念,說明你Hexo沒有安裝成功。
$ hexo init
在博客根目錄下會生成以下文件
/source:/_post中存放MarkDown編寫的博文等源文件
/themes:存放主題文件结蟋,每個主題包含主題配置文件(_config.yml)
_config.yml:站點配置文件脯倚,用于配置博客信息,如網站信息嵌屎,主題設置
在博客根目錄可執(zhí)行如下命令用于啟動服務器推正,主要用來本地預覽:
hexo g #完整命令為hexo generate,用于生成靜態(tài)文件(即public文件夾)
hexo s #完整命令為hexo server宝惰,將上面的文件部署到本地服務
瀏覽器訪問http://localhost:4000
植榕,你會看見一個默認主題是landscape的博客,可以在Git Bash中按Ctrl+C停止尼夺。
NexT主題配置使用
NexT比較簡潔耐看内贮,幾乎大多數人都喜歡。主題的官方文檔
NexT主題安裝
在博客根目錄下運行以下命令汞斧,將下載NexT主題夜郁。
$ cd themes //切換到主題文件夾
$ git clone https://github.com/theme-next/hexo-theme-next next //將其克隆的hexo-theme-next重命名為next
Hexo 有兩份主要的配置文件(_config.yml):一份位于站點根目錄下,稱為
站點配置文件
,關鍵字站點粘勒;另一份位于主題目錄下竞端,稱為主題配置文件
,關鍵字主題庙睡。
建議使用Notepad++
打開配置文件事富,它內存比較小、免費乘陪。下載地址:
https://notepad-plus-plus.org/download/v7.5.9.html
修改站點配置文件
主要包含以下內容:
1统台、新增網站的信息
# Site
title: DeppWang's Blog #網站標題
subtitle: 這是副標題 #網站副標題
description: 堅持分享知識,堅持留言支持 #網站描述
author: DeppWang #你的名字
language: zh-Hans #網站使用的語言
timezone:
2啡邑、修改博客文章的URL贱勃,默認顯示英文,避免中文過長亂碼,需要在新建文章中的Front-matter(頂部-線包裹區(qū)域)中新增一個字段english_title配合使用贵扰,方生效仇穗。此項可暫時跳過
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://depp.wang #你網站的URL
root: /
permalink: :year/:month/:day/:english_title/ #此處將文字url改為英文,避免中文亂碼戚绕。
permalink_defaults:
3纹坐、將標簽和分類名在此處對應設置,這樣URl的中文改為對應英文舞丛,此項可暫時跳過
# Category & Tag
default_category: uncategorized
category_map:
設計模式: Design Pattern #為避免分類名稱為中文造成URL過于冗長耘子,將中文轉換成對于英文
數據庫: Database
tag_map:
單例模式: Singleton Pattern #為避免標簽名稱為中文造成URL過于冗長,將中文轉換成對于英文
排序算法: Sort Algorithms
4球切、主題更改next
# Extensions
# Plugins: -hexo-generator-sitmap
## Themes: https://hexo.io/themes/
theme: next #主題設置拴还,改為next
5、設置GitHub倉庫托管路徑
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo:
github: git@yourname.github.com:yourname/yourname.github.io.git,master //博客文件存儲位置欧聘;注意格式
修改主題配置文件
主要修改以下內容:
1、修改網址圖標端盆,可在http://tool.lu/favicon/上設計自己的網址圖標怀骤,替換themes/next/source/images/
文件下對應文件
favicon:
small: /images/favicon-16x16-next.png
medium: /images/favicon-32x32-next.png
apple_touch_icon: /images/apple-touch-icon-next.png
safari_pinned_tab: /images/logo.svg
2、新增頁面標簽焕妙、分類選項
menu:
home: / || home #主頁
#about: /about/ || user #關于頁面
tags: /tags/ || tags #標簽頁
categories: /categories/ || th #分類頁
archives: /archives/ || archive #歸檔頁
#schedule: /schedule/ || calendar
#sitemap: /sitemap.xml || sitemap #搜索引擎抓取
#commonweal: /404/ || heartbeat #公益404
#about: /about #關于頁面(需手動創(chuàng)建)
#search: /search #搜索頁面(需手動創(chuàng)建)
3蒋伦、根據個人喜好切換主題,以下切換為Mist主題
# Schemes
#scheme: Muse
scheme: Mist #切換為Mist主題
#scheme: Pisces
4焚鹊、設置博客頭像痕届,將頭像(如:deppwang.jpg)放在站點下的 /themes/next/source/images
文件夾下
# Sidebar Avatar
# in theme directory(source/images): /images/avatar.jpg
# in site directory(source/uploads): /uploads/avatar.jpg
avatar: /images/deppwang.jpg #設置頭像
5、設置博客友鏈
# Blog rolls
links_title: Links
#links_layout: block
#links_layout: inline
links: #鏈接
阿里中間件團隊博客: http://jm.taobao.org/
Jark's Blog: http://wuchong.me/
廖雪峰個人網站: http://www.liaoxuefeng.com/
6末患、設置文章中代碼主題
# Code Highlight theme
# Available value:
# normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: night #代碼主題
生成標簽研叫、分類頁面
主題文件修改第2條,已經在頁面上顯示出標簽和分類頁選項璧针,但此時還未完全成功配置嚷炉。需要在站點下打開Git Bash
運行分別以下命令生成標簽和分類頁面
hexo new page "tags"
hexo new page "categories"
在/source目錄下會生成一個tags和categories文件夾,里面包含一個index.md文件探橱。
可用有道云筆記或其他MarkDown編譯器打開申屹,修改title為中文名標簽、分類
常用hexo命令
hexo g
:完整命令為hexo generate隧膏,用于生成或更新靜態(tài)文件(即public文件夾哗讥,也就是整個博客網站的靜態(tài)文件)
hexo d
: 完整命令為hexo deploy,用于將public文件夾發(fā)布到遠程代碼托管網站中(如GitHub)
hexo clean
:用于清除靜態(tài)文件(public文件夾)胞枕。當hexo g
命令更新文件失敗時杆煞,可先清除文件
hexo g -d
:同時生成靜態(tài)文件,并發(fā)布,最實用
總結
Hexo主題不斷更新索绪,各項配置也在變化湖员,建議直接根據官方文檔配置。網上此類教程十分豐富瑞驱,可多加參考娘摔。此文不免出現差錯,有問題請留言唤反。