本文记录了利用Github pages建立个人博客的步骤。

github pages官方推荐使用Jekyll生成静态网页，jekyll支持各种不同的主题，Minimal-Mistakes是一个功能比较齐全的主题，除了外观设置外，还支持文章评论、文章搜索、文章标签、文章分类。

安装Github pages + Jekyll

1. 参考在github建立名为{username}.github.io的repository
2. clone {username}.github.io到本地

3. 本地安装jekyll并建立博客

   //安装jekyllgem install jekyll bundler//建立myblog并复制内容到根目录后删除myblog//如果直接在根目录建立，github在编译时可能会软连接错误，暂不知原因cd {username}.github.iojekyll new myblogcd myblogcp -r * ../cd ..rm -rf myblog

使用Minimal-Mistakes主题

1. 修改Gemfile:
   替换gem "jekyll"为gem "github-pages"， group: :jekyll_plugins
2. 修改_config.yml:
   中替换theme为remote_theme: "mmistakes/minimal-mistakes"。
3. 运行bundle update更新主题
4. 更改about.md和 _posts/0000-00-00-welcome-to-jekyll.markdown 中 layout为 single。

5. 在根目录下删除index.md，添加index.html，内容如下：

   ---layout: homeauthor_profile: true---

6. 运行bundle exec jekyll serve
   如果碰到No GitHub API authentication could be found.的问题，参考。
7. 访问127.0.0.1:4000查看页面
8. push到github，访问commits页面查看部署状态。
9. 访问{username}.github.io查看博客主页。

配置相关选项

在_config.yml中可以对主题进行配置。参考:

1. minimal_mistakes_skin 配置主题皮肤
2. locale: zh-CN 配置语言
3. title， name， bio等个人信息

4. 添加tags和category页面，_config.yml中配置：

   category_archive:  type: liquid  path: /categories/tag_archive:  type: liquid  path: /tags/

   建立文件tags/tag-archive.md:

   ---title: "文章标签"permalink: /tags/layout: tagsauthor_profile: true---

   建立文件categories/category-archive.md:

   ---title: "文章分类"layout: categoriespermalink: /categories/author_profile: true---

5. 打开搜索
   search : true
6. 建立导航栏

a. 运行bundle show jekyll找到gem的安装位置，我本机在/usr/local/lib/ruby/gems/2.4.0/gems/jekyll-3.7.3。

# main linksmain:- title: "分类"    url: /categories/- title: "标签"    url: /tags/

修改Markdown 高亮配色

Jekyll使用rough作为代码高亮工具，不同的皮肤设置(minimal_mistakes_skin)有不同的高亮配色，这里我使用contrast皮肤，但代码高亮希望将背景从深色改为白色。

1. 在gems目录/usr/local/lib/ruby/gems/2.4.0/gems/minimal-mistakes-jekyll-{version}下复制 _sass 到博客根目录。

2. 修改_sass/minimal-mistakes/skins/_contrast.scss，替换 syntax highlighting (base16) 设置，参考。

   /* solarized light syntax highlighting (base16) */$base00: #fafafa !default;$base01: #073642 !default;$base02: #586e75 !default;$base03: #657b83 !default;$base04: #839496 !default;$base05: #586e75 !default;$base06: #eee8d5 !default;$base07: #fdf6e3 !default;$base08: #dc322f !default;$base09: #cb4b16 !default;$base0a: #b58900 !default;$base0b: #859900 !default;$base0c: #2aa198 !default;$base0d: #268bd2 !default;$base0e: #6c71c4 !default;$base0f: #d33682 !default;

3. 运行bundle update

添加Disqus评论支持

1. 参考注册，添加网站并得到shortname。

2. 设置_config.yml

   comments:provider: "disqus"disqus:    shortname: "your-disqus-shortname"//......default:    comments: true

设置文字大小

修改 _sass/minimal-mistakes/_variables.scss 对应font-size。

参考