Build Blog
Gitpage + Hexo 搭建个人博客，全程免费，记录注意事项。
总览
- Gitpage 慷慨的 github 给我们的网站托管
- Freenom 免费域名
- DNSPod 免费的DNS解析
- Markdown 熟悉一些 Markdown 的语法
- StaticSite A List of Static Site Generators for JAMstack Sites
Gitpage
create a new repository named username.github.io 创建一个新的代码库，名字：[github账号名].github.io
Freenom
-
1.sign in(我是通过google账号登录的) -> Services -> Register a new domain.
-
2.想guo名字，baidu/taobao 之类的想想就算了，想一遍过就想那种生僻的(手动滑稽) -> check availability -> 成功的话就选择免费的那些 get it now! -> 然后 checkout
-
3.结账的时候注意 Period 选最大的期限 12 Months@Free (有钱可以10 years) -> 如果失败了，通过 https://whoer.net/zh 查看当前代理所在国家，要和个人资料里国家填写一致，包括地址街道(不知道的话网上搜个地址吧)也要和所在国家一致，邮编最好也是对应街道的，手机号姓名什么都可随便填。
-
4.成功后不会提示 Attention! -> Services -> My domains 查看你的域名 -> Manage Domain -> Management tools -> Use custom nameservers (enter below) 这里要填写的就是DNSPod域名服务器的域。
DNSPod
-
登录到控制台 -> DNS管理 -> 我的域名 -> 添加刚才申请到的域名 -> 其中记录类型为 NS 的记录值填写到上面4.的最后一步
-
添加几个记录：这里可以参考 gitpage的指导
| 主机记录 | 记录类型 | 记录值 |
|---|---|---|
| www | CNAME | [github username].github.io. |
| @ | A | 185.199.108.153 |
| @ | A | 185.199.109.153 |
| @ | A | 185.199.110.153 |
| @ | A | 185.199.111.153 |
- 点击刷新，我的情况是直接就可以使用
StaticSite
选择一个静态站点生成工具，我用的 hexo
跟着文档做就好了，主要是配置文件的修改，遇到问题才会去看源码。开始遇到的坑是图片的绝对路径错误
//img/xxx.jpg 生成后是这种路径，不过我添加了自定义域名后自动解决了这个问题
常用的hexo命令：
1hexo new post [name of post]
2hexo generate
3hexo serve
4hexo clean && hexo deploy
最后 && 注意
-
在开始创建的代码仓库设置里，设置自己的Custom domain，自定义域名
-
Freenom 购买免费域名时，当前 ip 所在地和账号资料的位置信息一定要对应
-
hexo deploy后会覆盖自定义域名后生成的CNAME文件。把要保存的文件放在source文件夹里。 -
我更改了一些
_config.yaml配置后permalink: :title/，发布成功，github 更新成功，本地 serve 也都正常，但是页面仍旧是之前的。尝试删除.nojekyll文件和.deploy_git目录后再次发布成功。
站长工具
百度统计
https://tongji.baidu.com/
_config.yaml 配置参数 ba_track_id: ol14dc912ccw01s4cxd12ss0c1acwz
Google分析
https://analytics.google.com/
这里 fork 的 hexo 主题的源码似乎有 bug，需要时使用 Google Analytics 提示的最新代码
_config.yaml 配置参数 ga_track_id: UA-xxx-x
接入 google 广告
https://www.google.co.in/adsense/start/#/?modal_active=none
代码写在/hexo-theme-huxblog/themes/huxblog/layout/_partial/footer.ejs
要注意的是：写在<head></head>之间
一审失败，提示我只有2篇帖子，需要有更多的帖子，并且运行几个月后再来试试。
站点地图
让百度，Google收录自己的博客站点
百度
地址链接 验证主要有三种方法：
- 1.文件验证 我最终是通过这个方式通过的。试了一下不能直接复制里面的内容，以同名文件的形式传到 github 上；须上传下载的原文件才可以。
- 2.HTML标签验证 没试过
- 3.CNAME验证 开始通过这个方式验证，看破了帮助，死活过不去，于是乎换成了第一种
地址链接
也可以在Google搜索中输入site:[your_domain] like site:vongola.tk
没收录的话就会提示你去点击链接请使用 Google Search Console
验证方式：
在 DNS 解析加入提示信息的记录即可
| 记录类型 | 记录值 |
|---|---|
| TXT | google-site-verification=xxx |
1Tips: 里面还提供了测试网站速度的工具，很有趣
其他
接入评论功能
https://disqus.com/
-> I want to install Disqus on my site -> 填写信息 重要的是Websit Name 要求全网唯一，设定后不可改变 -> 设置_config.yaml的参数disqus_username: [上一步的Websit Name]
据说有收益，定期会审查，如果你的网站满足 Reveal，就会在一周内被联系。(emmm…)
支持 TOC
https://github.com/bubkoo/hexo-toc 我的设置：
1# _config.yaml
2toc:
3 maxdepth: 3
4 class: toc
5 slugify: transliteration
6 decodeEntities: false
7
8# css
9.toc {
10 float: right;
11 margin-left: 40px;
12 padding: 10px 20px;
13 background: #f1f1f1;
14 border-radius: 10px;
15 box-shadow: 0 0 3px #bbb;
16}
17
18# post
19
支持置顶
安装插件
1npm uninstall hexo-generator-index --save
2npm install hexo-generator-index-pin-top --save
post 的配置
1---
2top: true
3---
