博客搭建小记

前言

在搭建这个博客之前,个人也曾尝试在 VPS 上使用 WordPress 搭建自己的个人博客,但是搭建出来的博客效果不是很好,也就没有在 VPS 的博客上发表过博文。前两天偶然发现可以将自己的博客搭建在 GitHub 上,而且 hexo 这个框架能够方便的管理自己的博客,加之 NexT 主题的简洁美观和丰富的个人定制,遂立刻动手搭建了自己的博客,以此文记录博客搭建的过程中遇到的一些问题和个人设定的小结。

使用 Algolia 搜索

博客站点的搜索服务采用的是 Algolia,前往 Algolia 注册页面,注册一个新账户。 可以使用 GitHub 或者 Google 账户直接登录,注册后的 14 天内拥有所有功能(包括收费类别的)。之后若未续费会自动降级为免费账户,免费账户总共有 10,000 条记录,每月有 100,000 的可以操作数。

API Key 问题

在根据 NexT 主题的 Algolia 官方配置文档更新站点配置文件之后,执行 hexo algolia 命令出现错误,错误中提示 HEXO_ALGOLIA_INDEXING_KEY 未设置,查找文档后发现可以通过以下语句设置变量 HEXO_ALGOLIA_INDEXING_KEY:

1
export HEXO_ALGOLIA_INDEXING_KEY=…

设置完成后,执行 hexo algolia 命令仍然出现错误信息,错误信息的大致内容为没有为 hexo 提供可写入的权限,查看 hexo-algolia 官方主页后发现提供的 API Key 需要提供 Add records, Delete records, List indices, Delete index 权限,而默认创建的 API Key 好像只有一个 Search 权限。

hexo-algolia

解决方法是进入 Algolia 官网,进入 DashBoard,点击侧边栏 API Keys ,如下图所示修改 API Key 权限, 最后 UPDATE 即可。

API Key permission

修改 Algolia 搜索结果显示

在主题配置文件中,找到 algolia_search 关键字,修改 labels 标签,个人的博客修改如下:

algolia-search-label

修改文章底部#号标签

修改模板 ~/blog/themes/next/layout/_maro/post.swig, 搜索 rel=”tag”>#, 将 # 符号换成 <i class="fa fa-tag"></i> 即可,效果见文章底部。

修改网站图标和博主头像

将需要更换成的网站图标(两个图标)放置在 themes/next/source/images 文件夹里,并修改主题配置文件,如下图所示:

website-icon-settings

博主头像的修改与网站图标的修改过程相似,将博主的头像同样放置在 themes/next/source/images 文件夹里,并修改主题配置文件,如下图所示:

website-avataricon-settings

主要参考文章

  1. hexo 官方文档
  2. NexT 主题官方文档
  3. 简书 hexo+next添加 algolia 搜索
  4. CSDN hexo 的 NexT 主题个性化教程:打造酷炫网站