Github pages + Minimal-Mistakes + Disqus to build a personal blog record

This article details the steps to build a personal blog using Github pages.

github pages officially recommends using Jekyll to generate static web pages. Jekyll supports a variety of different themes. Minimal-Mistakes is a fully functional theme. In addition to appearance settings, it also supports article comments, article search, article tags, and article classification.

Install Github pages + Jekyll

1. Refer to the github pages homepage to create a repository named {username}.github.io on github 2.
Clone {username}.github.ioto the local
3. Install jekyll locally and create a blog
shell //安装jekyll gem install jekyll bundler //建立myblog并复制内容到根目录后删除myblog //如果直接在根目录建立，github在编译时可能会软连接错误，暂不知原因 cd {username}.github.io jekyll new myblog cd myblog cp -r * ../ cd .. rm -rf myblog

Using the Minimal-Mistakes theme

1. Modify Gemfile:
replace gem "jekyll"with gem "github-pages"， group: :jekyll_plugins
2. Modify _config.yml:
replace themewith remote_theme: "mmistakes/minimal-mistakes".
3. Run bundle updateUpdate Theme
4. Change about.mdand _posts/0000-00-00-welcome-to-jekyll.markdownMedium layoutto single. 5. Delete and add
in the root directory , the content is as follows: 6. Operation If you encounter problems, refer to Resolve ERRORS . 7. Visit the viewing page 8. Push to github, and visit the commits page to view the deployment status. 9. Visit the View Blog home page.index.mdindex.html
--- layout: home author_profile: true ---
bundle exec jekyll serve
No GitHub API authentication could be found.
127.0.0.1:4000

{username}.github.io

Configure related options

Themes can be configured in _config.yml. Refer to Configurations : 1.minimal_mistakes_skin
configure theme skin2.Configure language3.title
, locale: zh-CNname , bio and
other personal information /category-archive.md : 5. Open search search : true 6. Build a navigation bar a. Run to find the installation location of the gem, my computer is there . b. Enter , enter the minimal-mistakes-jekyll-{version} folder, copy **_data** to the blog root directory. c. Enter the copied _data folder and modify the navigation.yml file. Add category and tag navigation bar.

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

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

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

bundle show jekyll/usr/local/lib/ruby/gems/2.4.0/gems/jekyll-3.7.3
/usr/local/lib/ruby/gems/2.4.0/gems

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

Modify Markdown highlight color

Jekyll uses rough as a code highlighting tool. Different skin settings (minimal_mistakes_skin) have different highlighting colors. Here I use the contrast skin, but the code highlighting wants to change the background from dark to white. 1. Copy **_sass** to the blog root directory
in the gems directory. 2. Modify and replace the syntax highlighting (base16) setting, refer to Sylesheet/Color . 3. Run/usr/local/lib/ruby/gems/2.4.0/gems/minimal-mistakes-jekyll-{version}
_sass/minimal-mistakes/skins/_contrast.scss
/* 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;
bundle update

Add Disqus comment support

1. Refer to I want to install disqus on my site to register, add a website and get a shortname.
2. Set _config.yml
comments: provider: "disqus" disqus: shortname: "your-disqus-shortname" //...... default: comments: true

set text size

Modify the _sass/minimal-mistakes/_variables.scsscorresponding font-size.