hexo搭建的博客中添加搜索、评论功能、文章字数统计功能

博客 专栏收录该内容
3 篇文章 0 订阅

hexo搭建的博客中添加添加搜索、评论功能、文章字数统计功能

本次使用的hexo主题为Butterfly

添加搜索功能

搜索功能使用的是Algolia插件, 官网地址

1. 安装Algolia

cnpm install -S hexo-algolia

2. 打开 Algolia官网注册登录进入控制台如下图所示

在这里插入图片描述
在这里插入图片描述

3. 在主题目录下的_config.yml中进行配置

algolia_search:
  enable: true
  hits:
    per_page: 6
  labels:
    input_placeholder: Search for Posts
    hits_empty: "We didn't find any results for the search: ${query}" # if there are no result
    hits_stats: "${hits} results found in ${time} ms"

在这里插入图片描述

4. 在项目根目录下的_config.yml中进行配置

# 搜索功能配置
algolia:
  applicationID: '你的applicationID'
  apiKey: '你的apikey'
  indexName: '你新建的页面名称'

在这里插入图片描述

5. 在项目根目录下打开git bash执行如下命令(必须在git bash中执行)

export HEXO_ALGOLIA_INDEXING_KEY=你的Admin API Key
hexo algolia

在这里插入图片描述

6. 在我的电脑-高级属性中配置如下图所示

变量名:HEXO_ALGOLIA_INDEXING_KEY
变量值:你的Admin API Key

在这里插入图片描述
备注

  1. 如果不执行第五、六步,则可能会出现如下报错
	Please set an HEXO_ALGOLIA_INDEXING_KEY environment variable to enable content indexing.
  1. 对搜索功能有更改时(html、css等)均需要在git bash中执行hexo algolia。

参考地址

  1. https://jerryc.me/posts/21cfbf15/#Algolia
  2. https://github.com/oncletom/hexo-algolia
  3. http://www.werty.cn/2019/07/hexo/hexo%20algolia命令执行失败解决方案/
  4. https://www.zhihu.com/question/46822587/answer/308411949

添加评论功能

评论功能使用的是Valine插件, 官网地址

1. 打开LeanCloud进行登录注册

2. 创建应用如下图所示

在这里插入图片描述

3. 查看APP ID等信息

在这里插入图片描述

4. 在主题目录下的_config.yml文件进行配置,如下图所示

在这里插入图片描述
参考地址

  1. https://jerryc.me/posts/21cfbf15/#Valine
  2. https://valine.js.org/quickstart.html
  3. https://leancloud.cn/dashboard/app.html?appid=YDCJCx1H4IjIwg0bikGfBV5p-gzGzoHsz#/key

添加文章字数统计功能

文章字数统计功能使用的是hexo-wordcount依赖。

1. 安装依赖

cnpm install hexo-wordcount --save

2. 在主题目录下的_config.yml文件进行配置,如下图所示

wordcount:
  enable: true

在这里插入图片描述

在这里插入图片描述
参考地址

  1. https://jerryc.me/posts/21cfbf15/#%E5%AD%97%E6%95%B8%E7%B5%B1%E8%A8%88
  • 2
    点赞
  • 2
    评论
  • 6
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值