Hexo修改记录

2024-02-25 blog-entry 3.1K 字 14 分钟

主题配置文件

配置文件位于<root>/themes/shoka/_config.yml

赞赏功能

关闭文章下的赞赏功能

reward:
  # If true, reward will be displayed in every article by default.
  enable: false

底部widgets

关闭底部显示随机评论功能

widgets:
  # 随机文章
  random_posts: true
  # 随机评论
  recent_comments: false

字数和阅读时间统计

启用hexo-symbols-count-time插件的统计功能，在主题的config中配置

# 页尾全站统计
footer:
  since: 2023
  count: true

# 文章界面统计
post:
  count: true

代码高亮

在项目根目录下的config文件中停用了hexo自由的代码高亮功能，该功能与主题相关功能不兼容

highlight:
  enable: false # edit for Theme.shoka
  # line_number: true
  # auto_detect: true
  tab_replace: ''
prismjs:
  enable: false # edit for Theme.shoka

图库

在 <root>/source/_data/images.yml 文件中写入完整链接
使用图床

- https://example.cn/XX/abcdefg.jpg

或者在主图配置文件中设置图床API

image_server: "https://example.cn/api/api.php"

评论

使用LeanCloud 的 appId 和 appKey。

valine:
  appId: #Your_appId
  appKey: #Your_appkey
  placeholder: ヽ(○´∀`)ﾉ♪ # Comment box placeholder
  avatar: mp # Gravatar style : mp, identicon, monsterid, wavatar, robohash, retro
  pageSize: 10 # Pagination size
  lang: zh-CN
  visitor: true # 文章访问量统计
  NoRecordIP: false # 不记录 IP
  serverURLs: # When the custom domain name is enabled, fill it in here (it will be detected automatically by default, no need to fill in)
  powerMode: true # 默认打开评论框输入特效

如果某文章需要关闭评论，在文章的 Front Matter 中配置

---
title: 关闭评论
comment: false
---

根目录配置文件

永久链接

在<root>/_config.yml中配置永久链接格式为分类名/标题/

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://lyrago.xyz
root: /
permalink: :category/:title/ # edit for Theme.shoka
permalink_defaults:

全局配置永久链接

在 _config.yml 中设置 permalink 选项
例如将其设置为分类名/文件名的形式

permalink: :category/:title/

之后只需在每篇文章的 Front-matter 中部分指定分类名

categories:
  - blog-entry

实际的文件名是根据文章标题生成的，并且默认情况下 Hexo 会将空格转换为连字符 -，大写字母转换为小写字母。

指定文章永久链接

在文章的Front-matter中设置永久链接，永久链接应该以 / 或 .html 结尾 使用categories指定文章的分类

---
title: title
date: 2024-02-25 15:01:49
categories: Blog-Entry
permalink: /Blog-Entry/title.html
---

精选分类

要想在首页显示某一分类，只需在该分类下存放封面图 cover.jpg 即可，但是在这之前，仍需要进行一些配置。

在_config.yml 文件中，配置每个分类对应的英文映射, 格式如 Display Name: File Name，Display Name将会作为显示内容，File Name 则作为目录文件名。

# Category & Tag
default_category: uncategorized
category_map: # edit for Theme.shoka
  配置记录: config
  修改记录: blog-entry
tag_map:

hexo 会自动处理路径中的特殊字符，~`!@#$%^&*()-_+={}|;:”’<>,.? 以及空格，这些全部会被替换成 -
所以请避免在设置中使用上述字符，否则可导致无法抓取到目录下的 cover.jpg

现在，为了方便管理，我们可以给每一个文章设置 Front Matter 来规定其所在的目录，例如

title: Hexo修改记录
date: 2024-02-25 15:01:49
categories:
  - [配置记录, 修改记录]

则根据映射表，该md的路径为 config/blog-entry ，如果希望显示修改记录为精选分类，则在blog-entry目录下放入 cover.jpg 即可，同样的，如果想让 配置记录 目录为精选分类，则在 config 下放置cover.jpg 即可。

在 hexo g 时，本分类的封面图会自动被复制到 public 目录里相应的位置，为了方便管理，建议在 _posts 中就将md放入对应的目录，同时修改站点配置文件的永久链接

permalink: :title/

源代码修改

cdn.jsdelivr.net

由于使用cdn.jsdelivr.net加载缓慢，将blog下的所有cdn.jsdelivr.net全部替换为fastly.jsdelivr.net

悬挂备案号

修改shoka\layout_partials\footer.njk文件 原文件最后一段：

  {%- if theme.footer.powered %}
  <div class="powered-by">
    {{ __('footer.powered', _url('https://hexo.io', 'Hexo') + ' & Theme.' + _url('https://github.com/amehime/hexo-theme-shoka', 'Shoka')) }}
  </div>
  {%- endif %}

修改后：

  {%- if theme.footer.powered %}
  <div class="powered-by">
    {{ __('footer.powered', _url('https://hexo.io', 'Hexo') + ' & Theme.' + _url('https://github.com/amehime/hexo-theme-shoka', 'Shoka')) }}
    |
    <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener noreferrer">鄂ICP备2024032134号</a>
  </div>
  {%- endif %}

polyfill

Polyfill是一块代码（通常是web上的js），为旧浏览器提供它没有原生支持的较新功能；抚平不同浏览器之间对JS实现的差异，但是由于访问较慢且无太大作用，这里直接注释 shoka\layout_partials\layout.njk文件的第145行

<script src="https://cdn.polyfill.io/v2/polyfill.js"></script>

Gravatar & cravatar

Gravatar是一个公共头像服务,只需要去Gravatar.com注册账号绑定自己的域名邮箱，然后上传自己喜欢的头像,在逛博客评论的时候，邮箱填写您的域名邮箱，会默认输出你在Gravatar上传的头像。
Cravatar是lifepress团队在国内做的一个公益项目，是一个Gravatar完美的替代品，Cravatar100%兼容Gravatar的头像API，可通过替换域名的方式来使用Cravatar接替Gravatar。
现在使用的valine评论用的是作者发布在网络上的，而我们无法直接对源码进行更改，所以我们需要下载下来进行相关配置。

打开网站后F12能看到网站请求了一个 MiniValine.min.js 文件，现在将该文件下载到本地，存放在 blog\themes\shoka\source\js\MiniValine.min.js 之后去主题的config文件中注视点valine路径并修改：

vendors:
  css:
    # 省略......
  js:
    # 省略......
    # valine: gh/amehime/MiniValine@4.2.2-beta10/dist/MiniValine.min.js
    valine: js/MiniValine.min.js

Hexo插件更新

hexo完成安装后，npm已安装包信息如下

D:\blog>npm ls
npm ERR! code ELSPROBLEMS
npm ERR! missing: hexo-theme-landscape@^1.0.0, required by hexo-site@0.0.0
hexo-site@0.0.0 D:\blog
+-- hexo-algoliasearch@2.0.1
+-- hexo-autoprefixer@2.0.0
+-- hexo-deployer-git@4.0.0
+-- hexo-feed@1.1.1
+-- hexo-generator-archive@2.0.0
+-- hexo-generator-category@2.0.0
+-- hexo-generator-index@3.0.0
+-- hexo-generator-tag@2.0.0
+-- hexo-pangu-spacing@1.1.0
+-- hexo-renderer-ejs@2.0.0
+-- hexo-renderer-multi-markdown-it@0.1.5
+-- hexo-renderer-stylus@3.0.0
+-- hexo-server@3.0.0
+-- hexo-symbols-count-time@0.7.1
+-- UNMET DEPENDENCY hexo-theme-landscape@^1.0.0
`-- hexo@5.0.0

与主题相关的插件信息

`-- hexo@5.0.0
+-- hexo-renderer-multi-markdown-it@0.1.5
+-- hexo-autoprefixer@2.0.0
+-- hexo-algoliasearch@2.0.1
+-- hexo-symbols-count-time@0.7.1
+-- hexo-feed@1.1.1

2024-09-08
将hexo更新到5.2.0版本
删除hexo默认的主题hexo-theme-landscape
将hexo-renderer-multi-markdown-it和hexo-pangu-spacing更新到最新版本

npm install --save hexo@5.2.0
npm uninstall  --save hexo-theme-landscape
npm install  --save hexo-renderer-multi-markdown-it@latest

更新后npm包信息如下

D:\blog>npm ls
hexo-site@0.0.0 D:\blog
+-- hexo-algoliasearch@2.0.1
+-- hexo-autoprefixer@2.0.0
+-- hexo-deployer-git@4.0.0
+-- hexo-feed@1.1.1
+-- hexo-generator-archive@2.0.0
+-- hexo-generator-category@2.0.0
+-- hexo-generator-index@3.0.0
+-- hexo-generator-tag@2.0.0
+-- hexo-pangu-spacing@1.1.0
+-- hexo-renderer-ejs@2.0.0
+-- hexo-renderer-multi-markdown-it@0.1.5
+-- hexo-renderer-stylus@3.0.0
+-- hexo-server@3.0.0
+-- hexo-symbols-count-time@0.7.1
`-- hexo@5.2.0

虽然更新了hexo-renderer-multi-markdown-it和hexo-pangu-spacing，但实际版本并未改变，本次操作只是将hexo升级到了5.2.0

nginx

http跳转https

在nginx中配置http跳转，如果只在url中输入域名，则会跳转到https

server {
    listen 80;
    server_name localhost lyrago.xyz www.lyrago.xyz;
    return 301 https://$host$request_uri;
}

图床服务

之前一直使用的存储桶，自从免费证书有效期变为三个月后，存储桶每三个月就要上线看一次，非常麻烦，遂决定直接使用服务器本地图床，卡就卡吧~

  1. 将图片统一存储到静态文件目录\blog\themes\shoka\source\images，在目录下新建子目录Article用于存储文章中图片，HomePage存放博客首页图片

nginx https和http下新增：

location /images/ {
    root /home/www/website;
    autoindex off;
    expires 30d;
    access_log off;
}
  1. 替换images url

将\blog\source\_data\images.yml中的url前缀替换到http://lyrago.xyz/images/HomePage/，后续文章中的图片慢慢替换到Article