首页 > 其他分享 >Hexo主题Next配置algolia站内搜索

Hexo主题Next配置algolia站内搜索

时间:2023-08-01 21:37:29浏览次数:39  
标签:站内搜索 hexo Hexo Next API KEY algolia Algolia

Algolia是一家为网站与移动应用提供托管式搜索API的初创企业,成立于2012年,总部位于旧金山,曾参加过去年的YC训练营。网站或移动应用只需嵌入简单代码数分钟即可实现搜索功能。

实现的效果如下

search

注册Algolia 打开Algolia进行注册。可直接使用github账号进行注册。

创建index 点击 NEW INDEX创建一个新的indexIndex Name 后面会使用到。 INDEX

编辑KEY 点击侧边栏API Keys可以看到 Application IDSearch-Only API KeyAdmin API Key。后面我们需要用到。 点击 ALL API KEYS,编辑KEY。

安装hexo-algoliasearch插件 在Hexo的根目录下执行

$ npm install hexo-algoliasearch --save

配置站点信息 打开 站点配置文件,添加algolia配置信息。

algolia:
  applicationID: 
  apiKey: 
  adminApiKey: 
  indexName: #创建index使用的Index Name
  chunkSize: 5000

打开 主题配置文件,添加algolia配置信息。

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

在环境变量中添加 HEXO_ALGOLIA_INDEXING_KEY, 在Hexo的根目录执行

$ export HEXO_ALGOLIA_INDEXING_KEY=粘贴上一步复制的 API KEY

再次执行

$ hexo clean
$ hexo algolia

至此,我们的工作就完成了。


参考:

Hexo+next 添加搜索功能

Hexo+Next集成Algolia搜索

觉得本文对您有一点帮助,欢迎讨论、点赞、收藏,您的支持激励我多多创作。

我的个人博客主页,欢迎访问

我的CSDN主页,欢迎访问

我的GitHub主页,欢迎访问

我的知乎主页,欢迎访问

标签:站内搜索,hexo,Hexo,Next,API,KEY,algolia,Algolia
From: https://blog.51cto.com/AomanHao/6927660

相关文章

  • XSAN架构迁移至STORNEXT架构导致存储数据丢失的服务器数据恢复案例
    服务器数据恢复环境:昆腾存储,操作系统:MACOS,存放的数据类型:MXF、MOV等格式视频文件。存储中有9个数据卷,其中包括1个META信息卷,8个DATA信息卷。服务器故障:由于业务需求,需要将整个存储空间从XSAN架构迁移到STORNEXT架构,迁移完成后管理员发现存储空间中的数据全部丢失。管理员查......
  • Next.js 实战
    0x1CSR,SSR,SSGCSR客户端渲染(Client-SideRendering)。常见B端Web应用开发模式,前后端分离,服务器压力相对更轻,渲染工作在客户端进行,服务器直接返回不加工的HTML用户在后续访问操作缺点:首屏时间长SSR服务端渲染(Server-SideRendering)。JSP/PHP已经体现了服务器端渲染,......
  • next_permutation的简单实现
    next_permutation的简单实现​ 首先需要从后往前找到第一对数字满足nums[i]<num[j],i<j.此时记下这个i为l,在从后往前找到第一个大于nums[l]的数字,下标记为r.此时交换nums[l],nums[r].然后对数组内l以后的内容进行反转.如果找不到满足第一个条件的l,则对全部数组进行......
  • vue3拖拽插件vue-draggable-next
    -基于sortablejs;npm地址:https://www.npmjs.com/package/vue-draggable-next配置项:https://github.com/SortableJS/Sortable#options import{VueDraggableNextasDraggable}from'vue-draggable-next';components:{HeaderTitle,TitlePanel,Draggable},......
  • VuePress@next 使用数学公式插件
    VuePress@next使用数学公式插件搞了一个VuePress1.0的现在升级了一下,但是使用数学公式的插件老报错啊!经过不懈努力,终于搞定了。现在记录一下。VuePress介绍VuePress是一个以Markdown为中心的静态网站生成器。你可以使用Markdown来书写内容(如文档、博客等),然后VuePress......
  • Next.js 开发环境设置 SSL 证书
    在Next.js中设置证书时,你可以按照以下步骤进行操作:生成自签名证书:在开发环境中,你可以使用自签名证书来启用HTTPS。可以使用工具如OpenSSL来生成自签名证书。以下是一个示例命令:opensslreq-nodes-new-x509-keyoutserver.key-outserver.crt这将生成一个名为serv......
  • 问题--链表指针传参,修改next指针只传值
    1.问题--链表指针传参,修改next指针只传值Link_creat_head(&head,p_new);//将新节点加入链表在这当中head头指针传的是地址,而p_new传的是值,这二者有什么区别?#include<stdio.h>#include<stdlib,h>//定义结点结构体typedefstructstudent{//数据域intnum;......
  • Python【22】 __iter__, __next__, iterable, iterator, 可迭代对象, 迭代
    参考:https://www.jianshu.com/p/1b0686bc166d......
  • ABP VNext添加全局认证(如何继承AuthorizeFilter)
    前言目前公司采用的开发框架是ABPVNext微服务框架最近突然发现一个问题,ABP中如果控制器或服务层没有加 Authorize特性的话,则不会走身份认证,且不会认证Token如图: 但是项目已开发大半,一个个去补Authorize特性,工作量比较大,也容易产生遗漏就想着以前做单体应用的时候......
  • Cloud Ace 成为 Google Cloud Next '23 联合赞助商
    CloudAce是谷歌云全球战略合作伙伴,拥有300多名工程师,也是谷歌最高级别合作伙伴,多次获得GoogleCloud合作伙伴奖。作为谷歌托管服务商,我们提供谷歌云、谷歌地图、谷歌办公套件、谷歌云认证培训服务。CloudAce,Inc.(总部位于东京千代田区;总裁青木诚;以下简称“CloudAce”)将成......