前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >hexo-butterfly-搜索系统引入

hexo-butterfly-搜索系统引入

作者头像
hahah
发布2022-06-15 19:48:54
1.4K0
发布2022-06-15 19:48:54
举报
文章被收录于专栏:爪哇学习日记爪哇学习日记

hexo-butterfly-搜索系统引入

本地方式

开发说明:

<1>安装hexo-generator-search,按照文档做相应的配置(格式只支持xml)

代码语言:javascript
复制
npm install hexo-generator-search --save

<2>在全局配置文件_config.yml文件中添加配置:

​ 具体配置参考官方说明:https://github.com/wzpan/hexo-generator-search

​ 模板参考:

代码语言:javascript
复制
search:
  path: search.xml
  field: post # post:文章范围、page:页面范围、all:覆盖所有
  content: true # 内容是否包含每一篇文章的全部内容
  template:  # ./search.xml 指定定制的XML模板

<3>修改主题配置文件

代码语言:javascript
复制
local_search:
  enable: true

测试结果

Algolia方式

​ algolia的插件有两种,可根据个人需求择一构建即可。hexo-algoliahexo-algoliasearch

构建思路

代码语言:javascript
复制
<1>引入相关插件
<2>注册algolia,创建集合存储信息
<3>配置_config.yml存储algolia相关参数
<4>配置主题配置文件,开启algolia的搜索模式(关闭本地搜索)

hexo-algolia

开发说明

<1>安装hexo-algolia,按照文档做相应的配置

代码语言:javascript
复制
npm install hexo-algolia --save
  • 注册algolia,创建新建index
  • Setting->打开API Keys

​ 选择All API Keys,新建一个拥有CRUD权限的api key(指定相应的index)

<2>在根目录的站点配置文件_config.yml 中加入配置

代码语言:javascript
复制
algolia:
  applicationID: 'applicationID'
  apiKey: 'apiKey'
  indexName: '...'

​ 配置完成,随后执行hexo algolia,执行成功之后查看algolia中相关内容(如果提交失败,则先clean项目)

<3>数据推送

​ 上传数据到algolia(当添加了新文章,搜索不到的时候则需要刷新algolia)

代码语言:javascript
复制
hexo clean
hexo algolia

代码语言:javascript
复制
# 先配置环境变量,否则报如上错误(在gitbase中使用export指令)

export HEXO_ALGOLIA_INDEXING_KEY= your apiKey
hexo algolia

# window配置方式,进入到博客项目下node_modules/.bin

set HEXO_ALGOLIA_INDEXING_KEY=apiKey

# 随后进入博客项目根目录,清理后重新执行

hexo clean、hexo algolia

<4>修改主题配置文件

代码语言:javascript
复制
# Algolia search
algolia_search:
  enable: true
  hits:
    per_page: 6

测试结果

hexo-algoliasearch

开发说明:参考文档 algolia注册完成,配置参考上述内容,调整为

<1>引入hexo-algoliasearch,按照文档做相应的配置

代码语言:javascript
复制
npm install hexo-algoliasearch --save

# 如果hexo没有自动检测组件,则在_config.yml文件中引入插件配置
plugins:
  - hexo-algoliasearch

<2>_config.yml配置如下所示

代码语言:javascript
复制
algolia:
  appId: ""
  apiKey: ""
  adminApiKey: ""
  chunkSize: 5000
  indexName: ""
  fields:
    - content:strip:truncate,0,500
    - excerpt:strip
    - gallery
    - permalink
    - photos
    - slug
    - tags
    - title

<3>主题配置文件,开启algolia_search配置

代码语言:javascript
复制
algolia_search:
  enable: true
  hits:
    per_page: 8
    
# PS:完整配置参考如下所示,butterfly摘取了核心的配置内容并将部分参数在国际化部分做了处理以适配不同的语言配置,如有需要在不变动原有butterfly提供的参数配置基础上,可以进入到指定的themes/butterfly/languages对相应语言配置进行调整
search:
  title: 搜索
  load_data: 数据库加载中
  algolia_search:
    input_placeholder: 搜索文章
    hits_empty: '找不到您查询的内容:${query}'
    hits_stats: '找到 ${hits} 条结果,用时 ${time} 毫秒'
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2021-01-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • hexo-butterfly-搜索系统引入
    • 本地方式
      • Algolia方式
        • hexo-algolia
        • hexo-algoliasearch
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档