Hexo+Github博客搭建小白教程


Hexo+Github博客搭建小白教程

昨天宅在家里一天搗鼓一天的搭建的博客,基本功能是有了,當然還有很多不足以后慢慢修飾吧

博客地址:點擊查看

效果圖:

 

 

是不是還挺挺炫酷的,現在來開始搭建吧

首先安裝好環境,環境自行百度本篇不做介紹了

1、安裝Node.js

點擊地址

2、添加國內鏡像源

如果沒有梯子的話,可以使用阿里的國內鏡像進行加速。

npm config set registry https://registry.npm.taobao.org

3、安裝Git(MAC 自帶忽略)

點擊安裝教程  地址

以上1、2、3都安裝環境已經安裝直接跳過

4、注冊Github賬號

 

 

兩個箭頭名字最好一致

加入前面地址 pikachuworld, 后面的   songxiaotao.github.io 那么你的博客地址就會變成https://pikachuworld.github.io/songxiaotao.github.io 

選擇主題

打開上面github博客地址https://pikachuworld.github.io/

初步效果圖:

 

ctrl+c關閉本地服務器。

首先右鍵打開git bash,然后輸入下面命令

git config --global user.name "pikachuWorld"  //用戶名
git config --global user.email "XXXX@163.com"  //郵箱

用戶名和郵箱根據你注冊github的信息自行修改。

然后生成密鑰SSH key:

ssh-keygen -t rsa -C "xxx@163.com" // 

打開github,在頭像下面點擊settings,再點擊SSH and GPG keys,新建一個SSH,名字隨便。

git bash中輸入 

cat ~/.ssh/id_rsa.pub

在gitlab上綁定公鑰

setting→SSH Keys→Add an SSH key

將輸出的內容復制到框中,點擊確定保存。

輸入ssh -T git@github.com,如果如下圖所示,出現你的用戶名,那就成功了。

打開博客根目錄下的_config.yml文件,這是博客的配置文件,在這里你可以修改與博客相關的各種信息。

修改最后一行的配置:

deploy:
  type: git
  repository: https://github.com/pikachuWorld/pikachuWorld.github.io.git //你的github項目地址
  branch: master

5、寫、發布文章

首先在博客根目錄下右鍵打開git bash,安裝一個擴展npm i hexo-deployer-git

然后輸入hexo new post "article title",新建一篇文章。

然后打開 \你的blog目錄\source\_posts的目錄,可以發現下面多了一個文件夾和一個.md文件,一個用來存放你的圖片等數據,另一個就是你的文章文件啦。

編寫完markdown文件后,根目錄下輸入hexo g生成靜態網頁,然后輸入hexo s可以本地預覽效果,最后輸入hexo d上傳到github上。這時打開你的github.io主頁就能看到發布的文章啦。

 

6、個性化設置(matery主題)

下面的個性化設置主要針對的是matery主題   主題的原地址在這里:點擊查看

7、 遇到的坑解決方案

按照教程配置之后

1、注意hexo d發布的時候輸入用戶密碼報錯

remote: Support for password authentication was removed on August 13, 2021.

這是因為github為什么要把密碼換成token,把密碼換成token就可以了,致於怎么創建具體看下面的教程

如何生成自己的token

這是因為github為什么要把密碼換成token,把密碼換成token就可以了,致於怎么創建具體看下面的教程

如何生成自己的token

2、關於配置評論模塊(配置有風險當心獲取你clientSecret你清空的github)這個配置但是評論還有bug,先留着以后查找一下

為Hexo添加Gitalk評論插件https://segmentfault.com/a/1190000014085547

3、Hexo: 添加Valine評論(郵件通知、評論列表頭像)

點擊教程

配置之后出來valine評論彈幕, 需要把代碼需要修改一下

 看看效果:

 

目前主要是功能總結:

已經完成:
1、推薦優質文章
2、搜索功能
3、評論模塊
4、打賞功能(可以重點測試哈)

待開放的功能:
1、頁腳統計
2、關於部分頁面項目替換
3、頁面樣式UI

 

-------------------更新中------------------

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM