typora繫結github部落格_部落格搭建之Hexo(第二期)
技術標籤：typora繫結github部落格
❝通過Hexo搭建一個個人網站為了保證教程的詳細性，將分成多期連載釋出
❞
對於新手小白來說一般不可能一次就配置成功,所以要做好失敗重來的心理準備,如果你看不懂教程但想堅持下去,可以點選下方留言或者加我wechat
點我留言
非誠勿擾
本地安裝Hexo部落格
在磁碟中找一個合適的位置,用來存放Hexo程式,以及後續的文章,外掛等,路徑不要有中文例如我在F盤下新建hexo-blog資料夾,開啟資料夾,在空白處右擊選擇Git Bash Here,進入git視窗
(由於我已經安裝過很多次,所以示例圖片會與實際情況有差異,但配置步驟都是一致的,不必在意)
?安裝Hexo部落格程式 輸入以下命令npm install -g hexo-cli並敲擊回車,
!第一次等待時間比較久屬於正常現象 出現下圖紅框中的程式碼即成功
?初始化和安裝所需的元件 輸入以下命令hexo init並敲擊回車
耐心等待安裝 出現start blogging with Hexo!即安裝成功
?繼續輸入npm install
?輸入hexo g(這裡是生成頁面的意思)
?輸入hexo s(這裡是啟動預覽的意思) 如圖所示,這裡已經可以在本地瀏覽器訪問http://localhost:4000來檢視預覽了,(!!!需要注意按下ctrl+c會停止預覽)
下面就是Hexo的預設主題了,本地部落格安裝到此結束
部署到Github
我們需要將本地程式部署到Github上
開啟安裝Hexo部落格的資料夾,可以發現裡面多了很多配置,這裡先介紹幾個經常使用的
public 存放網站檔案
themes 存放主題檔案
source 存放使用者檔案
_config.yml 站點配置
部署到Github後,可以使用其域名進行訪問
?安裝hexo-deployer-git 輸入
npm install hexo-deployer-git --save
耐心等待
在部落格資料夾中開啟站點配置_config.yml(可選擇記事本開啟,或者vs,notepad++等) 在程式碼的末尾加上下面程式碼
deploy:
type: git
repository: https://github.com/你的使用者名稱/你的使用者名稱.github.io.git
branch: master
其中repository中的連結為你倉庫中的連結,當然你也可以使用ssh來部署
完成後再git中輸入
hexo d(這裡是部署的意思)
會開始跑程式碼進行部署,如果失敗了可能是上邊步驟出錯,在試一試,
或者輸入hexo clean(意思是清理快取,重新整理),在進行部署(hexo d)
這時候我們就可以通過Github的域名來訪問我們的網站了https://使用者名稱.github.io
寫文章
開啟根目錄下站點配置_config.yml,找到post_asset_folder: false修改為post_asset_folder: true並儲存(這裡是為了生成博文的同時,在同級目錄下生成一個同名資料夾,來儲存博文所需的圖片,方便修改和管理)
在根目錄下
輸入命令
hexo new post "文章名"
如圖,可以看見已經生成了一個存放照片的同名資料夾和.md文件,這是Markdown的檔案格式,這時候就需要用到Markdown編輯器--Typora,後臺回覆關鍵字獲取
雙擊開啟.md文件進行博文書寫 在設定中找到影象並勾選優先使用相對路徑,當然你也可以使用圖床,將圖片放置在同名資料夾裡面,方便管理
這裡我放在article-title同名資料夾下做演示
開啟博文後title代表標題,date代表時間,tag是標籤的意思 後續還會加入分類,置頂,訪問密碼等
!!! Typora支援Markdown語法以及HTML語法,所以想要寫出優雅的博文,還是要懂一些這方面的知識
釋出文章
記住下面的步驟,會經常用到
hexo new post "文章名" #生成一篇文章
hexo g # 生成頁面
hexo s # 本地預覽(這步是為了檢驗一下文章是否有不妥的地方,非必需)
hexo d # 部署
!!!這四步就是寫博文並發表的基本步驟hexo s為本地預覽,非必需hexo g和hexo d是釋出博文必需
左右滑動看圖↓↓↓
hexo new page "name" # 新建頁面
hexo g -d # 生成頁面並部署(組合鍵)
hexo clean # 清除快取和已生成的靜態檔案
hexo help # 幫助
hexo clean為清理快取,不必每次都用
部署成功後不一定會立刻渲染出來,需要等待一會屬於正常現象
第一次使用為了防止出錯一般可以先進行hexo s預覽一下
在進行hexo d部署上去
??可以看到已經部署上去了,已經可以通過域名進行訪問了
Hexo預設主題雖然挺簡約的,但功能不夠全面,下篇將寫到如何更換主題
