使用Hexo搭建github博客步驟,超簡便

categories:node

  • 工具

tags:git

  • git
  • Windows
  • 搭建博客

你只須要node環境和一個github帳號就能夠開工啦!
github

本教程適合於Windows環境,Mac教程也大同小異npm

利用hexo搭建github博客很簡單,甚至不須要編程的基礎也能夠完成,下面是個人博客成品的展現高翔的博客

1.準備工做

  • 你的電腦須要配置node環境(包括npm)
  • 你須要有github帳號和git基礎(上傳過項目)
  • 你的電腦須要安裝了git工具(git Bash)

ok,能夠正式開始搭建了!編程

2.使用Hexo搭建框架

2.1 請使用命令行工具,執行下面命令安裝Hexo
$ npm install hexo -g
2.2 在任意一個目錄初始化Hexo項目

在任意一個目錄下執行如下命令markdown

hexo init

當你看到Start blogging with Hexo! 恭喜!框架就已經搭建好了hexo

2.3接下來執行如下命令就能夠在本地起服務

hexo server

而後訪問http://localhost:4000/,就能看到本身博客的雛形了框架

3 發佈一篇文章

此時你的命令行正在起服務,按ctrl+c暫停服務,輸入y肯定。
用下面的代碼來新建一篇文章編輯器

hexo new "個人第一篇文章"

而後工具

hexo generate

image

如圖,雙引號中間就是你的文章的名字,此時你再用hexo server起服務,就能看到本身的文章出如今頁面中了


image

可是如今文章只有一個標題,文章的文件是在你的目錄的source_posts文件夾裏面

裏面有個的第一篇文章.md就是記錄你文章信息的markdown文件,你能夠用markdown語法來編輯它

這個.md文件用sublime或者寫字本均可以打開編輯,如今也有不少能夠實時預覽的markdown編輯器,我使用的是有道雲筆記,瞭解更多關於markdown


image

如上圖:
  1. title表示文章標題
  2. tags:表示給文章添加的標籤
  3. 以上的內容會在文章列表頁顯示,點擊進入文章頁之後纔會顯示more下面的內容

4 配置你的個性化博客主題

4.1在知乎上面的這個問題提供了不少精品主題

有哪些好看的Hexo主題?

選取你喜歡的clone或下載下來,放進你的項目目錄的themes文件夾裏面

4.2 更改主題的配置文件

首先打開項目根目錄下的_config.yml文件

裏面的每一個鍵值對在冒號:後面都須要跟一個空格,請注意

title: 博客的名字
description: 你的描述
author: 做者名字

themes:你的主題的文件夾的名字

通常來講這些須要更改,你能夠根據英文本身理解修改

themes在最下面,把它的值改成你剛放進去的主題的名字

再在命令行執行

hexo generate
hexo server

刷新就能夠看到你的主題上線啦

通常來講,主題的文件夾裏面都還有一個_config.yml文件,來配置裏主題可更改的信息

5 部署到github

5.1 建立github博客項目

你須要在你的github頁面右上角你的頭像旁邊點擊 + 號按鈕,選擇repository。

在 Repository name 欄中,輸入

[你的用戶名].github.io

這個用戶名必須和github用戶名徹底同樣,如個人github
用戶名爲gaoxianglyx

項目名爲 gaoxianglyx.github.io

5.2 配置裏本地的項目與github鏈接

在你項目剛打開的_config.yml文件中,找到depoly,修改成以下

deploy:
  type: git
  repository: git@github.com:gaoxianglyx/gaoxianglyx.github.io.git
  branch: master

repository後面的值爲你剛建立的項目的地址

5.3 發佈到github

在命令行執行

npm install hexo-deployer-git --save

安裝完成後,使用如下命令即可以上傳項目到github

hexo generate
hexo deploy

如今,你的博客就已經能夠在線進入了,地址爲:[你的用戶名].github.io

6 其餘提醒

通常經常使用的hexo命令爲

hexo clean //清理(非必須),通常上傳前線clean再generate

hexo generate //將文章生成爲博客的一部分,可簡寫爲 hexo g

hexo server //本地預覽(非必須), 可簡寫爲 hexo s

hexo deploy //推送到GitHub,可簡寫爲 hexo d
相關文章
相關標籤/搜索