建立github博客

搞github博客从头至尾

建github.io

首先需要申请自己的github账号，在自己的首页点击Repositories,然后点击new，如图所示

然后在name上填写用户名.github.io，接着Create（因为我创建过此仓库，故不可重复）

这个生成好的 Repository 就是用来存放博客内容的地方，也只有这个仓库里的内容，才会被 mycaozf.github.io 这个网页显示出来

Hexo

Hexo 是一个博客框架。它把本地文件里的信息生成一个网页。

使用 Hexo 之前，需要先安装 Node.js 和 Git。

操作如下

安装 Node.js
- 前往 https://nodejs.org/en/
- 点击 10.15.0 LTS 下载
- 安装
- 打开 cmd，输入 node -v
- 得到：v10.15.0
  
  安装成功
安装 Git
- 前往 https://git-scm.com/
- 点击 Downloads
- 打开 cmd，输入 git --version
- 得到：git version 2.20.1.windows
  
  安装成功
安装 Hexo
- 打开 cmd
- 输入 npm install -g hexo-cli
- 回车开始安装
- 输入 hexo -v
  
  安装成功
创建本地博客
- 在D盘下创建文件夹 blog
- 鼠标右键 blog，选择 Git Bash Here。如果没有安装 Git，就不会有这个选项。
- Git Bash 打开之后，所在的位置就是 blog 这个文件夹的位置。（/d/blog）
- 输入 hexo init 将 blog 文件夹初始化成一个博客文件夹。
- 输入 npm install 安装依赖包。
- 输入 hexo g 生成（generate）网页。由于我们还没创建任何博客，生成的网页会展示 Hexo 里面自带了一个 Hello World 的博客。
- 输入 hexo s 将生成的网页放在了本地服务器（server）。
- 浏览器里输入 http://localhost:4000/ 。就可以看到刚才的成果了。
- 回到 Git Bash，按 Ctrl+C 结束。
  
  此时再看 http://localhost:4000/ 就是无法访问了。
发布一篇博客
- 继续在 Git Bash 里，所在路径还是 /d/blog。输入 hexo new "My First Post"
- 在 D:\blog\source_posts 路径下，会有一个 My-First-Post.md 的文件。编辑这个文件，然后保存。
- 回到 Git Bash，输入 hexo g
- 输入 hexo s
- 前往 http://localhost:4000/ 查看成果。
- 回到 Git Bash，按 Ctrl+C 结束

将本地 Hexo 博客部署在 Github 上

操作如下：
1. 获取 Github 对应的 Repository 的链接。
  - 登陆 Github，进入到 mycaozf.github.io
  - 点击 Clone or download
  - 复制 URL 待用
    
    我的是 https://github.com/MyCaoZF/mycaozf.github.io.git
2. 修改博客的配置文件
  - 打开配置文件 /d/blog/_config.yml
  - 找到
    1
    #Deployment
    填入以下内容：
    1
    2
    3
    4
    deploy:
    type: git
    repository: https://github.com/MyCaoZF/mycaozf.github.io.git
    branch: master
3. 部署
  - 回到 Git Bash
  - 输入 npm install hexo-deployer-git --save 安装 hexo-deployer-git 此步骤只需要做一次。
  - 输入 hexo d
  - 得到 INFO Deploy done: git 即为部署成功
    
    之前我们创建的 ReadMe.md 会被自动覆盖掉。
4. 查看成果
  
  前往 mycaozf.github.io 即可。
使用 Next 主题

更多 Hexo 的主题看这里

操作如下：

回到 Git Bash。输入 git clone https://github.com/iissnan/hexo-theme-next themes/next

这样，该主题的文件就全部克隆到 D:\blog\themes\next 下面。
修改博客配置文件
- 打开 D:\blog_config.yml
- 找到 theme:
- 把 Hexo 默认的 lanscape 修改成 next。即 theme: next
- 找到 # Site，添加博客名称，作者名字等。
- 在 language 后面填入 en 或者 zh-Hans，选择英文或者中文。
- 找到 # URL, 填入 url。比如 url: https://mycaozf.github.io
  
  填入名字后会有很风骚的 © 2017 CaoZF 的字样出现在博客底部。
重新生成部署即可
- 回到 Git Bash。输入 hexo g -d就可以了。
  
  先把修改的内容生成网页，再部署。
查看成果

前往 mycaozf.github.io 即可。

在Hexo中使用LaTeX语法输入数学公式

在Hexo中启用MathJax

此处以Next主题其为例，在Next中启用MathJax只需要一步。在d/blog/theme/next下找到_config.yml。用文本编辑器找到如下部分：

plain _config.yml# MathJax Support
mathjax:
  enable: false
  per_page: true
  cdn: //cdn.bootcss.com/mathjax/2.7.1/latest.js?config=TeX-AMS-MML_HTMLorMML

将第二行修改为

1	enable: true

即可。

如此以来就在Next主题中启用了MathJax支持，但事实上还存在着不少问题：

部分数学公式直接显示为代码的形式
部分数学公式的下标、角标等显示异常
希腊字母字体显示异常

更换渲染引擎

Hexo默认使用hexo-renderer-marked引擎进行网页渲染，其中对许多字符诸如划线、下划线、中括号等定义了转义。因此，在进行网页渲染时，数学公式中的这些字符先通过hexo-renderer-marked进行转义，就发生了歧义，而再通过MathJax渲染出来的数学公式，自然就显示不正常了。
在知道了原因以后，问题也就迎刃而解了，解决方法就是更换Hexo默认的hexo-renderer-marked渲染引擎。hexo-renderer-kramed就是一个不错的选择，它在hexo-renderer-marked的基础上修复了一些Bug，其中就包括取消大部分多余的转义。

卸载hexo-renderer-marked，安装hexo-renderer-kramed

1	npm install hexo-renderer-kramed --save`

确保所有公式都被渲染

在条件支持的情况下，MathJax会对页面上的所有位置的标签内都进行渲染；但在条件不允许时，MathJax对数学公式的渲染可能止于页面上的某个位置，其后的数学公式都将不被渲染而直接显示为代码的形式。
这时，就需要在文章的开头font-matter中手动打开MathJax的开关，如下图：

title: index.html
date: 2016-12-28 21:01:30
tags:
mathjax: true

如上，在使用了数学公式的页面上增加一行

1	mathjax: true

这样就能确保页面上所有数学公式都被正确渲染了。

但是以上方法还是不能转换行内公式，即一行内不能够有两对dollar符号，具体解决方法正在试，不过已不影响正常使用！

参考文献：

在Hexo中使用LaTeX语法输入数学公式

用 Hexo 和 GitHub Pages 搭建博客

搞github博客从头至尾

建github.io

Hexo

操作如下

将本地 Hexo 博客部署在 Github 上

操作如下：

使用 Next 主题

操作如下：

在Hexo中使用LaTeX语法输入数学公式

在Hexo中启用MathJax

更换渲染引擎

确保所有公式都被渲染