前言

  1. 博客文章打草稿，加密。
  2. 博客加入搜索引擎
  3. 搭建博客评论系统

本文使用hexo的butterfly主题，记录文章加密，搜索引擎收录和评论系统。

文章加密

打草稿和加密两种方式

文章草稿

文章正在撰写，但是不想deploy到网站，可使用此功能：

1
hexo n draft "draft-name"

此时在 source/_drafts 下生成草稿文件 “draft-name”。发布文章可以使用 hexo publish "draft-name"，draft-name 不包含扩展名，将文章从草稿状态转换为发布状态；将选定的草稿文件从 _drafts 目录移动到 _posts 目录。然后使用 hexo s 或者 hexo g 发布。

如果不想发布，只想通过localhost看草稿的格式，可以使用 hexo s --drafts

文章加密

文章阅读需要输入密码，安装插件：

1
npm install --save hexo-blog-encrypt

在需要加密的文章开头(front-matter)添加一行 password: 密码内容

还可以在 front-matter 中添加多行内容：

1
2
3
password: 密码
message: Hey, 这篇文章被加密了，请输入密码！
wrong_pass_message: Oh, 密码错了，检查一下好吗～

SEO搜索引擎优化

SEO 是由英文 Search Engine Optimization 缩写而来，中文意译为“搜索引擎优化”。SEO 是指通过站内优化比如网站结构调整、网站内容建设、网站代码优化等以及站外优化。

Baidu收录

第一步： 添加网站

  1. 进入百度资源搜索平台，登录百度账号，完成身份认证。
  2. 依次点击 用户中心–>站点管理–>添加网站。
  3. 推荐使用文件验证，按照提示点击下载验证文件，将文件放在 themes/butterfly/source 下。
  4. 为了防止生成网站时编译source中的文件，导致验证文件被修改，在 _config.yml 中，添加忽略编译的文件，如下： 
    1
    2
    3
    4
    skip_render:
    - baidu_verify_codexxxxxxxxxxxx.html
    - googlexxxxxxx.html
    - BingSitexxxxxxx.xml

第二步： 提交到站点

百度提供了三种自动提交方法：主动推送、自动推送和 sitemap ，以下是官方给出的解释：

  • 主动推送：最为快速的提交方式，推荐您将站点当天新产出链接立即通过此方式推送给百度，以保证新链接可以及时被百度收录
  • 自动推送：是轻量级链接提交组件，将自动推送的 JS 代码放置在站点每一个页面源代码中，当页面被访问时，页面链接会自动推送给百度，有利于新页面更快被百度发现
  • sitemap：您可以定期将网站链接放到sitemap中，然后将sitemap提交给百度。百度会周期性的抓取检查您提交的sitemap，对其中的链接进行处理，但收录速度慢于主动推送

1.主动推送
安装插件

1
npm install hexo-baidu-url-submit --save

在根目录 `_config.yml` 写入以下配置：

1
2
3
4
5
baidu_url_submit:
count: 10               # 提交最新的多少个链接
host: blog.codejerry.cn    # 在百度站长平台中添加的域名
token: <token>      # 秘钥
path: baidu_urls.txt   # 文本文档的地址，新链接会保存在此文本文档里

> 注： 其中 `<token>` 在[普通收录](https://ziyuan.baidu.com/linksubmit/index)中的api提交界面可以找到。有个接口调用地址，后边的token=xxxx，这个xxxx即为需要填入的token

继续在根目录 `_config.yml` 中，加入新的deployer，如下最后一行：

1
2
3
4
5
deploy:
  - type: git
    repo: git@aliyun:/var/repo/blog.git
    branch: master
  - type: baidu_url_submitter

> 注意两个type前有符号，以及缩进

测试

1
hexo cl && hexo g && hexo d


出现 `INFO Deploy done: baidu_url_submitter` 即推送成功。

2.自动推送
个人用 butterfly 主题，在 themes/butterfly/layout/include/head.pug 的末尾，追加如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
script().
(function(){
      var bp = document.createElement('script');
      var curProtocol = window.location.protocol.split(':')[0];
      if (curProtocol === 'https') {
        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
      }
      else {
        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
      }
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(bp, s);
})();

以上代码亲测不好用，可以 不进行 自动推送这一步

3.sitemap
安装插件

1
2
3
npm install hexo-generator-sitemap --save     
npm install hexo-generator-baidu-sitemap --save
npm i hexo-seo-autopush --save

用 hexo g && hexo d 生成和部署，public 文件夹下会出现 baidusitemap.xml 文件

去 [百度资源平台](https://ziyuan.baidu.com/linksubmit/index)，点击sitemap，添加 `https://blog.codejerry.cn/baidusitemap.xml`
> 注：后续google和bing的站点地图都添加该网址。

Google收录

第一步： 登录谷歌搜索控制台，添加网站

有两种登录方式，推荐使用第一种

  1. 第一种验证方式，选择右边网址前缀，添加域名 https://blog.codejerry.cn，选择html文件验证，将下载文件放在 themes/butterfly/source 下。在 _config.yml 中，添加忽略编译的文件，如下：

    1
    2
    3
    4
    skip_render:
    - baidu_verify_codexxxxxxxxxxxx.html
    - googlexxxxxxx.html
    - BingSitexxxxxxx.xml

    然后点击验证。

  2. 第二种验证方式，选择左边通过域名的dns解析，按照网页提示即可完成。

第二步： 点击左侧 站点地图，添加文件 https://blog.codejerry.cn/baidusitemap.xml，点击提交，然后看状态为 成功 即可。

Bing收录

进入必应搜索控制台，网站验证、添加站点地图，与google收录一致。

完成收录以后，出去打个水，下楼溜达一圈，回来就可以线上搜索到你的文章了

Twikoo评论系统

Twikoo 是一个简洁、安全、无后端的静态网站评论系统，基于腾讯云开发。

在主题 _config.yaml 文件中， 将默认评论系统设置为twikoo，如下：

1
2
3
comments:
  use: # Valine,Disqus
    - twikoo
1
2
3
4
5
twikoo:
  envId: https://twikoo.codejerry.cn
  region:
  visitor: true
  option:

然后是云服务器服务配置，使用twikoo镜像：

1
2
3
cd /srv
mkdir twikoo
vim docker-compose.yaml

添加如下内容：

1
2
3
4
5
6
7
8
9
version: '3'
services:
  clash:
    image: imaegoo/twikoo
    container_name: twikoo
    ports:
      - "8880:8080"
    volumes:
      - ./data:/app/data

再然后，通过nginx将 twikoo.codejerrty.cn 中的二级域名 twikoo 绑定到8880端口。

1
2
cd /etc/nginx/sites-available/single
vim twikoo.conf

添加如下内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
server {
    listen 80;
    server_name twikoo.codejerry.cn;
    location /{
        proxy_pass http://127.0.0.1:8880;
    }
}
server {
    listen 443 ssl;
    server_name twikoo.codejerry.cn;
    ssl_certificate /etc/letsencrypt/live/codejerry.cn/fullchain.pem; # domain
    ssl_certificate_key /etc/letsencrypt/live/codejerry.cn/privkey.pem; # .key

    location /{
        proxy_pass http://127.0.0.1:8880;
    }
}

nginx的使用参考 Nginx双域名管理内网服务

其他注意事项

评论系统的域名，最好不要使用泛域名，层层传递过去比较慢。直接绑定一个blog的二级域名，可解决谷歌爬取不到的问题。

所有安装的npm包都在 node_modules里边，如果出现不知名错误，可以将这个文件夹删除，然后输入 npm install 进行安装。