Hexo博客搭建

Hexo博客搭建备忘

参考链接:
https://www.cnblogs.com/liuxianan/p/build-blog-website-by-hexo-github.html
https://www.cnblogs.com/fengxiongZz/p/7707219.html
https://blog.csdn.net/quuqu/article/details/64121812

关键步骤

  1. 创建github io pages
  2. 申请域名并绑定(可选)
  3. 安装git
  4. 安装nodejs
  5. cmd中测试npm、node命令是否可用
  6. 安装hexo:命令 npm install hexo -g(如果安装卡慢可以替换淘宝源,npm config set registry https://registry.npm.taobao.org)
  7. 准备好一个文件夹,新建一个博客 hexo init
  8. 启动测试 $ hexo g # 生成 $ hexo s # 启动服务
  9. 浏览器访问http://localhost:4000 测试是否OK
  10. 其他折腾例如主题、统计等功能,因人而异,自行折腾。参考链接

Hexo常用命令

新建页面 hexo new ‘name’
其他参考官方文档

绑定自己的域名(可选)

  1. 购买域名
  2. 在hexo的source文件夹下新建CNAME文件,无扩展名,填写自己的域名然后提交即可

Hexo提交搜索引擎

参考链接:

https://www.cnblogs.com/tengj/p/5357879.html
https://www.cnblogs.com/tengj/p/5352572.html

Hexo博客的图片

博客中不可避免的会使用图片,开始的时候我使用七牛云存储图片,七牛云每个月提供10GB的流量也够用了。但是新建一个仓库只能提供一个临时的测试域名,本以为测试域名一个月到期之后再重新生成一个替换掉文章里的链接就可以了,但是没想到过期之后就不能再生成,只能绑定自己的域名,而且域名必须要在国内备案,而备案流程上很复杂。

所以,后面我直接将图片部署在github上,放在source/image里,文章里用 ![](/images/image.jpg)的方式访问,每次上传图片前用压缩工具将图片和gif压缩到500K以内,对流量压力和访问速度影响不大。

开启数学公式支持

进入到主题目录,打开_config.yml文件,修改mathjax默认false为true:

1
2
3
4
5
# MathJax Support
mathjax:
enable: true
per_page: true
cdn: //cdn.bootcss.com/mathjax/2.7.1/latest.js?config=TeX-AMS-MML_HTMLorMML

然后,在需要公式支持的文章页面,头部添加mathjax标记如下:

1
2
3
4
5
---
title: xxxx
categories: yyyyy
mathjax: true
---

示例:$P=\frac{v^2}{R}$

开启流程图支持

安装插件npm install hexo-filter-mermaid-diagrams --save
主题配置文件下mermaid设置为true
示例:

graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
sequenceDiagram
   participant Alice
   participant Bob
   Alice->John:Hello John, how are you?
   loop Healthcheck
     John->John:Fight against hypochondria
   end
   Note right of John:Rational thoughts 
prevail...    John-->Alice:Great!    John->Bob: How about you?    Bob-->John: Jolly good!
gantt
        dateFormat  YYYY-MM-DD
        title Adding GANTT diagram functionality to mermaid
        section A section
        Completed task            :done,    des1, 2014-01-06,2014-01-08
        Active task               :active,  des2, 2014-01-09, 3d
        Future task               :         des3, after des2, 5d
        Future task2               :         des4, after des3, 5d
        section Critical tasks
        Completed task in the critical line :crit, done, 2014-01-06,24h
        Implement parser and jison          :crit, done, after des1, 2d
        Create tests for parser             :crit, active, 3d
        Future task in critical line        :crit, 5d
        Create tests for renderer           :2d
        Add to mermaid                      :1d

开启百度自动推送

  1. 开启主题文件中baidu_push: true
  2. themes\next\layout\post.swig中添加百度的主动推送代码(在百度的站长管理界面中可以看到)

提交百度SEO收录

因为百度的爬虫爬的太厉害,github直接封锁了百度的爬取,所以如果什么都不做,博客只能在google上被搜索到,这个不利于中文博客的推广。所以我们需要将博客部署到coding上。

  1. 注册coding账户,注意要注册个人账户,coding现在被腾讯收购了,所以个人账户直接会跳转到https://dev.tencent.com/,直接微信注册账户即可,下面的coding说的都是腾讯的开发者平台。

  2. 创建一个为自己用户名的仓库,并在侧边栏的代码中,选择pages服务并打开,点击齿轮图标配置,填写自定义域名。

  3. 在coding的个人配置中,选择ssh key添加的地方,把自己机器的ssh key加上,否则待会代码推送不上来。

  4. 修改博客的_config.yml文件如下,xxx和sss分别填写自己在github和coding的git地址

    1
    2
    3
    4
    5
    deploy:
    type: git
    repo:
    github: xxxxxx.git,master
    coding: ssssss.git,master
  5. 在博客中hexo clean && hexo g && hexo d重新推送,代码就可以同时推送到github和coding上,刷新下coding的网页就可以看到代码已经传上来了。

  6. 我是在阿里云买的域名,所以去阿里云的域名解析配置中,设置将国内访问解析到coding,国外访问解析到github。
    hexo_blog_cname_info

  7. 在coding刚刚的pages服务界面,开启强制 HTTPS 访问功能,否则访问博客谷歌浏览器会提示不安全。这一步需要先到阿里云把解析到github的配置暂停,否则coding开启强制 HTTPS 访问的时候申请SSL证书会失败报错,申请成功后就可以再打开域名解析了。coding的SSL证书不像GITHUB那么方便,只有三个月有效期,过期后再操作一次本步骤。
    hexo_blog_coding_repo

  8. ping一下自己的域名,看是不是返回如下图所示从coding返回的响应。如果可以就可以按照上面Hexo提交搜索引擎章节的两篇文档,去百度提交sitemap了。百度的sitemap收录速度奇慢,一般要过一两周才能在百度上搜到你的博客。
    hexo_blog_ping_coding