本文使用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
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>普通收录中的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 即推送成功。

自动推送
个人用 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);
})();

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

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 文件

百度资源平台,点击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.codejerry.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双域名管理内网服务

Twikoo系统邮件通知

以163邮箱为例,登录你的邮箱,点击 设置 --> POP3/SMTP/IMAP,开启 POP3/SMTP,然后手机验证,得到授权码(记得复制下来,因为只显示一次,有效期180天)。

随意打开你的一篇博客,最下方评论旁边有个 设置 图标,点击,输入注册密码(这个密码是管理员进入评论系统的密码)。

进去以后点击 Configuration --> Email notification,只需要填写以下几项即可:

1
2
3
4
5
6
SENDER_EMAIL: xxx@163.com (你想被通知的邮箱)
SMTP_SERVICE: 163
SMTP_PORT: 465
SMTP_SECURE: true
SMTP_USER: xxx@163.com (需与 SENDER_EMAIL 一致)
SMTP_PASS: smtp授权码

然后点击保存,出来在评论系统里输入昵称和邮箱,点击提交,就会收到邮件了。

其他注意事项

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

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