跳转至

如何使用 MkDocs 建立一个博客

下载必要组件

Python 官网 下载 python3.8.5

下载链接:link

安装完成后回到桌面,按下 Win+R,会出来一个「运行」;在框内输入

1
cmd

按下回车,你会得到一个「命令行窗口」。

输入

1
python --version

来查看 python 版本。如果输出是 Python 3.8.5 之类的东西,那么说明你已经安装完成 Python 了。

安装 pip

继续在命令行里输入

1
python get-pip.py && pip install --upgrade pip

待它结束后,输入

1
pip --version

来查看 pip 版本。如果输出是 pip 20.0.2 from /usr/local/lib/python3.8/site-packages/pip (python 3.8) 之类的东西,那么说明你已经安装完成 pip 了。

安装 MkDocs

继续在命令行中输入

1
pip install mkdocs

待它结束后,输入

1
mkdocs --version

来查看 Mkdocs 版本。如果输出是 mkdocs, version 0.15.3 之类的东西,那么说明你已经安装完成 MkDocs 了。

Git 官网 安装 git

下载链接:link

创建 GitHub repo

访问 GitHub,注册一个账号。

账号名以后 不能修改,而且假设你的账号名为 username,则你以后的博客地址将会为 https://username.github.io/

建立本地服务器

找到一个心爱的文件夹

举例:我们用 E:\blog\ 为博客目录。

打开命令行,输入

1
2
3
4
E:
mkdir blog
cd blog
mkdocs new my-blog && cd my-blog

你会发现你的 E 盘里多了个 blog 文件夹,而且里面有个 my-blog 文件夹。

搭建站点

E:\blog\my-blog\ 下,输入

1
mkdocs serve

然后打开你的浏览器,输入 http://127.0.0.1:8000/ 即可看到自己的博客啦!

链接到 GitHub Pages

自定义配置

主题设置

打开 E:\blog\my-blog\mkdocs.yml,将里面的内容替换为

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
site_name: Your Blog

nav:
    - 首页: README.md
    - 题解:
      - 概览: posts\editorials\index.md
      - AtCoder: posts\editorials\atcoder.md
      - BZOJ: posts\editorials\bzoj.md
      - CodeForces:
        - CF1393D: posts\editorials\codeforces\CF1393D.md
      - 洛谷: posts\editorials\luogu.md
      - POJ: posts\editorials\poj.md
    - 学习笔记:
      - 概览: posts\lectures\index.md
      - Dancing Links: posts\lectures\dlx.md
      - 回文树: posts\lectures\eertree.md
      - AC 自动机: posts\lectures\ac-automaton.md
      - 前缀函数与 KMP 算法: posts\lectures\kmp.md
      - 配对堆: posts\lectures\pairing-heap.md
    - 杂笔:
      - 概览: posts\articles\index.md
      - '如何使用 MkDocs 建立属于自己的博客': posts\articles\build-this-site.md
    - 说说:
      - 概览: posts\mood\index.md
      - '2020.08': posts\mood\2020-08.md
      - '2020.09': posts\mood\2020-09.md
    - 文化课:
      - 概览: posts\whk\index.md
      - 数学: posts\whk\maths.md
    - 关于:
      - 关于我: posts\about\intro.md
      - 友情链接: posts\about\friends.md
theme:
    name: 'material'
    language: 'zh'
    favicon: 'assets/img/favicon.ico'
    features:
      - tabs
markdown_extensions:
  - admonition                                   # 注解块支持
  - footnotes
  - meta                                         # 元数据支持
  - pymdownx.arithmatex:                         # 数学公式的TeX语法支持
      generic: true
  - pymdownx.betterem:
      smart_enable: all
  - pymdownx.caret
  - pymdownx.critic
  - pymdownx.details
  - pymdownx.emoji:                              # 表情支持
      emoji_generator: !!python/name:pymdownx.emoji.to_svg
  - pymdownx.highlight:
      linenums_style: pymdownx.inline
      linenums: true
      use_pygments: true
  - pymdownx.inlinehilite
  - pymdownx.keys
  - pymdownx.magiclink
  - pymdownx.mark
  - pymdownx.smartsymbols
  - pymdownx.superfences
  - pymdownx.tasklist:                           # 任务清单支持
      custom_checkbox: true
  - pymdownx.tilde
  - toc:
      permalink: true
extra_javascript:
  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
  - https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/highlight.min.js
  - https://polyfill.io/v3/polyfill.min.js?features=es6
  - javascripts/config.js
extra_css:
  - https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/styles/default.min.css
copyright: 'Copyright &#169 2018 - 2020 Yourname'