Jekyll博客搭建流程记录

环境配置

安装Ruby, Bundler.（看这里，更详细的看这里）

挑选jekyll模板

来这里挑选中意的模板。模板一般会有配置的说明，可以按照模板说明一步步来，把模板用起来。

模板配置(以chirpy为例)

chirpy模板页，点击homepage跳转到其对应的github页，按照readme配置即可。以下简要记录下实际配置chirpy的过程。

1. 点击use the starter template 后新建一个<user_name>.github.io的仓库;

2. clone下来;

3. 修改_config.yml

4. 在项目根目录下执行：bundle；

5. push到远程：

   git add .
   git commit -m 'first commit'
   git push origin main   # main是当前分支名称
   

6. push后会在github的action看到进程，action进程成功完成后会在github分支中看到gh-pages分支；

   注意这一步，到repo的setting里看看action权限是否够 参考

7. 更改publishing source

进入 https://<user_name>.github.io，此时主页已初始配置完成了。

模板使用

添加blog

1. 在项目根目录下增加_posts文件夹，在文件夹中按照添加markdown文件。

   • 建议此处添加模板本身提供的几个示例markdown，它们也是日后使用该模板的重要参考。

2. push到远程

   git add .
   git commit -m 'add blogs'
   git push origin main 
   

3. 等待github action（action有时会有延迟，不会立即出现）

4. 刷新https://<user_name>.github.io，查看网页端是否发生对应更改（可能存在延迟，或缓存问题，按ctrl + f5清空缓存。）

本地调试

在项目根目录下执行

jekyll s

修改对应文件后，刷新页面可即时看到更改。太方便啦。

若本地调试，则需要保证路径名中无中文！否则本地预览会报错（尽管远程后可正常显示）

文件名中含有中文，则可能无法正常访问，需要做以下修改: 参考

在blogs中添加图片

在项目根目录下新建assets/img文件夹，在文件夹中放置图片文件（或包含图片文件的文件夹），在blog中即通过图片文件路径索引图片，如

![](/assets/img/20210209/unBN.jpeg)