來到簡書平臺已經(jīng)有兩年多了，在這里見證了我的生信入門之路。由于種種原因吧，萌生了創(chuàng)建自己的個人博客的想法。利用周末兩天的時間摸索了結(jié)合hugo+github搭建個人博客的方法，總算是有個大致的雛形了，也許以后就主要在我的博客里記錄學(xué)習(xí)筆記了，下面簡單總結(jié)一下搭建流程。
- 博客網(wǎng)頁：https://lishensuo.github.io/
- github：https://github.com/lishensuo/lishensuo.github.io
1、安裝hugo
（1）首先下載安裝包https://github.com/gohugoio/hugo/releases
- 我的是window電腦，其次需選擇extended版本
- 選擇的是
hugo_extended_0.96.0_Windows-64bit.zip
（2）解壓、點擊安裝后，將hugo路徑添加到環(huán)境變量。
（3）在任意文件進(jìn)入cmd模式，輸入hugo version。如果正常返回版本信息，表明已經(jīng)成功安裝。
hugo version
#hugo v0.96.0-2fd4a7d3d6845e75f8b8ae3a2a7bd91438967bbb+extended windows/amd64 BuildDate=2022-03-26T09:15:58Z VendorInfo=gohugoio
hugo的操作都是命令行式。之后的cmd操作都是基于gitbash操作模式下，可自行安裝探索一下。下述的演示在
C:\Users\xiaoxin\Desktop\test目錄下
2、新建站點
- 在test文件夾，進(jìn)入gitbash的cmd模式
hugo new site myblog
#會新建一個 myblog 的文件夾
ls ./myblog
# archetypes/ config.toml content/ data/
# layouts/ static/ themes/
##我目前了解如下
#config.toml 進(jìn)行參數(shù)配置，與之后的theme相關(guān)
#content 之后博客(.md)的文件都儲存在這里
#layout 可個性化修改博客的展示細(xì)節(jié)，需要懂網(wǎng)絡(luò)架構(gòu)知識
#static 儲存一些靜態(tài)文件，比如本地圖片，插入到博客中
#themes 主題，接下來會介紹
關(guān)于配置文件toml，類似于yaml。不同人有不同的偏好，對于hugo，優(yōu)先toml；但也支持yaml。
3、下載主題
- 有多種hugo主題可供下載：https://themes.gohugo.io/
- 我這里選擇的是PaperMod主題，比較簡約，適合記筆記。https://adityatelange.github.io/hugo-PaperMod/ 這個博客是對于PaperMod主題的一個示例展示。
點擊具體每一種主題，都能找到提供的下載方式。最簡單的是git下載到上面提到的theme文件夾
cd ./myblog
git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod
ls ./themes
# PaperMod/
ls ./themes/PaperMod/
# LICENSE README.md assets/ go.mod i18n/ images/ layouts/ theme.toml
4、修改配置
按照我參考的示例博客比較推薦yaml，因此這里刪除原來的config.toml，改為config.yaml。
然后進(jìn)行博客主題的配置：一些基本配置在所有主題中都一樣；但也有一些參數(shù)是每個主題的自定義的。
- 通用配置參數(shù)查詢：https://gohugo.io/getting-started/configuration/
- PaperMod自定義參數(shù)查詢：https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-features/
- 示例配置：https://www.sulvblog.cn/posts/blog/build_hugo/#4%e9%85%8d%e7%bd%ae%e6%96%87%e4%bb%b6
暫時先配置最重要參數(shù)：theme
cat config.yaml
# baseURL: https://www.*****.cn #綁定的域名
# languageCode: zh-cn # en-us
# title: My first Blog
# theme: PaperMod # 主題名字，和themes文件夾下的一致
5、新建筆記
- 接下來就是寫一些博客筆記，需要有頭文件的markdown格式。
- 頭文件可以設(shè)置每篇博客的屬性，例如標(biāo)題，日期，作者等。
- 詳見https://gohugo.io/content-management/front-matter/
- 其中
draft表示該博客是否為草稿。如果是的話，之后不會被展示。
- 可通過下述命令，創(chuàng)建博客（也可以完全自己建一個）。然后按照markdown的格式增添內(nèi)容即可。
hugo new posts/fisrt-blog.md
cat ./content/posts/fisrt-blog.md
# ---
# title: "Fisrt Blog"
# date: 2022-04-16T11:47:19+08:00
# draft: true
# ---
#示例fisrt-blog.md
cat ./content/posts/fisrt-blog.md
# ---
# title: "Fisrt Blog"
# date: 2022-04-16T11:47:19+08:00
# draft: false
# ---
# # this is a blog
# welcome to my blog
# blalalalalala........
# 這里插入一張網(wǎng)上的圖片
# 
# End
6、測試博客
- 根據(jù)下述命令提示，進(jìn)入本地連接http://localhost:1313/ 查看博客的樣式
hugo server
# Built in 48 ms
# Watching for changes in C:\Users\xiaoxin\Desktop\test\myblog\{archetypes,content,data,layouts,static,themes}
# Watching for config changes in C:\Users\xiaoxin\Desktop\test\myblog\config.yaml
# Environment: "development"
# Serving pages from memory
# Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
# Web Server is available at //localhost:1313/ (bind address 127.0.0.1)
# Press Ctrl+C to stop
- 博客的首頁主題樣式
- 一篇博客的內(nèi)容
7、綁定域名
- 之后就是將博客內(nèi)容上傳到網(wǎng)上，有很多方式。我之前是上傳到github，簡單介紹如下；
（1）需要先在個人的github賬號中創(chuàng)建github.io倉庫，參考一張別人的圖。
（2）將當(dāng)前博客內(nèi)容編譯為html，放到public文件夾
#首先需要記得修改 config.yaml文件的 baseURL參數(shù)設(shè)置為你想要綁定的域名
## baseURL: https://www.username.github.io
##然后使用hugo編譯
hugo
# hugo -F --cleanDestinationDir
# 加了上述參數(shù)表示表示每次生成的public都是全新的，會覆蓋原來的。
ls ./public
# 404.html assets/ categories/ index.html index.xml
# page/ posts/ sitemap.xml tags/
（3）使用git將public文件夾的內(nèi)容上傳到github.io倉庫
cd public/
#(1)第一次上傳
git init
git add . #添加當(dāng)前路徑的所有文件
git commit -m 'create blog'
git remote add origin https://github.com/username/username.github.io.git
#根據(jù)gitbash提示操作
git push -u origin master
##如果push失敗，比如time out...可嘗試下面的命令
git config --global http.sslVerify "false"
git config --global --unset http.proxy
git config --global --unset https.proxy
#(2)之后再修改、更新博客
git add .
git commit -m 'add blogs'
git push -u origin master
如上操作后，理論上再訪問 https://username.github.io/ 就是一個博客的頁面了。當(dāng)?shù)谝淮尾僮鲿r總會遇到各種各樣的問題，比如我自己。就是不斷嘗試、報錯、再修改過程。
8、個性化修改
- 啟用PaperMod主題自帶的Search功能：搜索博客
（1）先在content文件夾新建search.md
---
title: "Search"
layout: "search"
---
（2）然后在config.yaml文件修改相關(guān)參數(shù)
#https://www.sulvblog.cn/posts/blog/build_hugo/#4%e9%85%8d%e7%bd%ae%e6%96%87%e4%bb%b6
- identifier: search
name: 搜索
url: search
weight: 80
- 啟用PaperMod主題的Archive欄：記錄所有博客的發(fā)表時間
·（1）先在content文件夾新建archive.md
---
title: "Archive"
layout: "archives"
summary: "archives"
---
（2）然后在config.yaml文件修改相關(guān)參數(shù)
- identifier: archives
name: 歸檔
url: archives/
weight: 41
此外參考https://www.sulvblog.cn/posts/blog/博客，修改了博客文章的側(cè)邊欄TOC目錄懸浮窗，標(biāo)簽云展示、SEO優(yōu)化等；參考卜蒜子http://ibruce.info/2015/04/04/busuanzi/，為網(wǎng)站添加了訪問量記錄。因為很多是細(xì)節(jié)的修改，就不細(xì)述了。
