hexo+coding靜態博客搭建和配置

git安裝

在官網下載對應版本號安裝便可git官網下載地址css

node環境安裝

node下載地址html

hexo安裝

在git bash中輸入如下命令:node

$ npm install hexo-cli -g

再建立一個hexo文件夾,在該文件夾目錄下初始化hexo:如下指令都在hexo文件夾下git bashgit

$ hexo init

安裝依賴包github

$ npm install

安裝git插件chrome

$ npm install hexo-deployer-git --save

加載靜態資源和開啓服務器npm

$ hexo g&&hexo d

http://localhost:4000/ 便可訪問本地博客瀏覽器

coding配置

由於github Pages來做爲博客有時候訪問比較慢,因此使用國內coding Pages做爲博客搭建bash

Coding上建立項目coding官網,註冊完畢首頁點擊建立項目服務器

clipboard.png

配置SSH Key(咱們使用SSH方式訪問倉庫)

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

# your_email@example.com 替換爲你本身的郵箱
# 過程當中須要輸入密碼等操做,能夠所有回車使用默認的

完成以後,C:UsersAdministrator下會多一個.ssh文件夾,裏面包含id_rsa和id_rsa.pub兩個文件,複製id_rsa.pub中的內容,返回到coding主頁->帳戶->SSH 公鑰配置便可,公鑰隨意,勾選長久有效,返回coding項目中複製以前建立項目的ssh,點擊代碼能夠查看到。

配置文件的修改

修改_config.yml文件

新增訪問倉庫的路徑

deploy:
  type: git
  repo: 項目的ssh
  branch: master

修改主題,把喜歡的主題下載下來,好比用比較熱門的next

$ git clone https://github.com/iissnan/hexo-theme-next themes/next

修改:theme: next

基本信息填充

title:xx(標題)
subtitle:xx(副標題)
description:xx(詳情)
author:xx(做者)
language:zh-Hans(中文)

具體設置其餘參數如:頭像、其餘論壇帳號等 next官網

注意點

root:須要改爲 /xx/ xx爲你的coding項目名,否則上線會出現js、css路徑問題

上傳項目

$ hexo g&&hexo d

即便用http://用戶名.coding.me/項目名 便可訪問線上的博客

拓展

  1. 新建文字:在項目的source/_posts中能夠建立md或者new執行來新建一篇文章

  2. 編輯md文件:下載sublime的liveload插件和chrome瀏覽器的liveload插件,在$ hexo
    s狀況下修改md文件,便可實時查看本地博客的編寫效果

  3. 加入本身項目:能夠在source文件夾中放入本身項目的文件夾,便可查看本身的html文件,不過hexo會對source文件下的進行渲染,因此須要設置,跳過渲染,這樣不會出現js渲染錯誤的問題。

skip_render:
  - 自定義文件夾/**
  - 自定義文件夾/**
相關文章
相關標籤/搜索