Markdown打造高逼格博客

這裏首先假設讀者你已經掌握了Markdown與GitHub的基本用法

若是不會, 請先自行百度或Google, 我目前還沒寫Markdown與GitHub的教程
看雲只是一個推薦, 能夠認爲協助生成格式化Markdowns, 不用固然也能夠手寫, 這裏只是本人推薦而已
想先看結果的請直接拉到底

你須要這麼幾個材料：

1. 在線文章生成網站, 首推「看雲」

   連接地址: 看雲

2. 終端命令行

   Windows使用powershell, Mac與Linux自帶便可

3. 編輯器(可選)

   如: VS Code, Atom, Sublime等等

4. GitHub帳號

   連接地址: GitHub

詳細步驟(圖文)

1. 看雲篇(書寫)

   • 建立文檔()

   • 文檔信息填寫

   • 前往編輯文檔

   • 新建章節

   • 新建章節的基本信息

   • 編輯或修改章節

   • Markdown編輯與內容提交

   • 新建子級章節

   • 新建子級章節的基本信息

   • 新建真正的子級章節的注意點

   • 子級章節在看雲看起來同樣, 可是注意新建方式不一樣致使的不一樣

   • 完成並同步

2. 看雲篇(獲取git地址)

   • 返回文章概要(或手動前往)

   • 前往文章設置

   • 獲取git地址

3. 拉取看雲文章源代碼

   若是你真沒git, Windows請搜一下 git bash, Mac命令行輸入git而後點擊安裝便可,

   • 使用powershell或其餘命令行工具(Mac與Linux同樣)

     cd .\Desktop\

     git clone https://git.kancloud.cn/zweizhao/kancloudtest.git (地址請使用你本身的)

     cd .\kancloudtest\

4. GitHub建立你的博客倉庫

   • 建立倉庫

   • 倉庫信息

   • 倉庫地址

5. 源代碼添加GitHub的倉庫

   git remote set-url --add origin https://github.com/ZweiZhao/blogs.git (地址請使用你本身的)

   或手動添加

6. 將代碼推到GitHub

   git push origin master

7. GitHub內容更新及查看

   • 注意上文說的子級區別

   • 這裏缺乏README.md文件, 後續會補上

8. 設置GitHub Pages(就是博客)

   • 前往GitHub倉庫的設置

   • 設置pages

     向下滾動

     選好點擊save保存

     保存成功後滾回來

     就是這個地址, 你的博客生成好了

   • 打開會報錯, 404

     緣由就是剛剛說的沒有README.md文件

   • 添加README.md文件

     • 回到源代碼, 並使用你的編輯工具在根目錄建立一個README.md文件, 寫入以下內容並保存

   • git操做提交

     git add .

     git commit -m '添加README.md'

     git push origin master

     刷新GitHub倉庫, 源碼出現README.md文件

   • 博客頁面正常顯示點擊有交互

> 到這裏,一個標準的GitHub Pages完成, 可是缺少美感的程序員或者吃瓜羣衆是很難再樣式上優化出什麼花, 尤爲是在使用Markdown的時候, 下面就是真正優(zhuang)化(bi)的時候了

1. 優化時候

   • 打開GitHub倉庫設置並前往pages所在位置

   • 選擇一個你以爲好看的主題並確認

   • 刷新你的博客頁, 若有必要, 請清理緩存一下, 再刷新

2. 打完收工

   最後有個坑注意一下, 就是你這邊對主題修改後, 改動的是GitHub的源代碼, 而你以前的主倉庫是看雲的, 因此這裏你須要再項目的 .git/config 文件內修改一下兩個倉庫的位置, 以下:

   • 各類編輯器打開 .git/config, 我用的是vim

   • 替換前

   • 替換後

   • 拉取代碼並提交

     git pull origin master

     git push origin master

   • 而後再替換回來便可

     除非你下次再更換主題, 不然基本不用再這一步了

3. 最後你們看看個人GitHub Pages

   zweizhao.github.io

   綁定域名後的

   www.zweizhao.com

---

文章相關項目源碼:
GitHub
http://www.zweizhao.com/blogs/ 感謝Star, Fork與Follow