HugoNexT4.7.2 新功能和升级提示

真是人算不如天算呀，原来是计划在大年夜前发Hugo NexT v4.7.2这个大版本的，可谁曾料想到身体遭受到一场突如其来的病毒感染，就连春节的气氛也是全被搅混无啦。由于此次版本发布发动的内容稍为有些多，在此写个升级的小提示分享下。这不趁着假期的小尾巴，赶紧是把剩余的工作给做完吧，为众多的Hugo NexT粉丝送上一份迟到的新年“贺礼” :gift:。

此次发布的Hugo NexT v4.7.2除修复发现的:bug:之外，还新增了不少新特性，参考如下：

• 支持不同国家的多语言切换
• 支持显示文章的总结摘要与过期信息提示
• 支持对长的代码块进行折叠显示
• 支持Bilibili视频与音乐播放嵌入显示
• 支持在Gemini和Pisces模式下显示二级导航菜单
• 支持类似Github风格的告警效果
• 支持阅读更多按钮时跳转时锚定后续内容的效果
• 支持Waline3的评论系统
• ......

接下来就一起看看如何从旧版本升级这个新版本吧，大家可以参考下面的操作记录调整自己的站点：

注意： 升级前一定要把Hugo软件版本到最新的版本，不然很多功能特性无法支持，也会导致升级失败。

配置更新

参考最新的hugo软件版本变化，将配置文件的名称由原来的config.yaml改为hugo.yaml，这个是可选的操作，大家按自己的喜好决定是否要调整。然后根据不同的功能启用，可以在原来旧的配置文件增加相应的配置项进行启用，具体参考下面的各项功能使用说明。

多国语言切换

开启了多国语言切换功能后，在站点的工具按钮会显示出一个地球的图标，点击后会直接定位到网页底部，有个下拉的菜单会显示国旗和语言名称，选择对应的语言即可进行切换。

配置文件更新

在配置文件中找到languageCode的配置项，在其下面增加多语言的参数配置，参考如下：

languages:
  zh-cn:
    languageCode: zh-CN
    languageDirection: ltr
    languageName: "简体中文"
    weight: 1    
  en-us:
    languageCode: en-US
    languageDirection: ltr
    languageName: English
    weight: 2
    ## 如果有其他要调整的参数，可在该语言下覆盖，比如：
    params:
      yearFormat: "2006"
      monthFormat: "01/02"
      dateFormat: "2006/01/02"
      timeFormat: "2006/01/02 15:04:05 -07:00"

注意： 这里的zh-cn和en-us是要和i18n下面的语言配置文件名称保持一致，才能让页面中的各项翻译生效。

文章发布

写文章时，需要按照不同的语言创建不同的文章，支持如下两种不同的风格进行文章存储：

# 文件夹管理（推荐）
content/post
└── helloworld
    ├── index.en-us.md
    ├── index.fr-fr.md
    └── index.md

# 文件管理
content/post
├── helloworld.en-us.md
├── helloworld.fr-fr.md
└── helloworld.md

提示： 上面没有指定语言的文章，会使用defaultContentLanguage配置项作为默认语言。

总结摘要与过期提示

配置文件更新

在配置文件中找到postMeta的配置项，在其下面增加summary和expired的参数配置，参考如下：

postMeta:
  # 是否开启过期提示
  expired: true
  # 是否开启摘要显示
  summary: true

提示： 这两个参数也是支持在文章头部的front matter中进行配置。

i18n文件更新（可选）

在站点的i18n目录下创建对应的语言配置文件，在PostMeta的配置项有个expired的参数，可按自己的需求进行调整，参考如下：

PostMeta:
  expired:
    title: "温馨提醒"
    info: "🕰️ 嗨，这篇文章已是#前的陈年佳酿，信息可能需要更新，阅读前请检查最佳赏味期限。"
    warn: "🚀 注意啦！这篇文章来自#以前，可能已跟不上时代的步伐。阅读时请自备时光机，小心穿越哦！"

提示： 这里的#符号是用来占位的，最终会被替换为实际的过期时间长度。

代码块折叠

只需要更新下配置文件即可，在配置文件中找到highlight的配置项，把原来的参数替换为如下的配置：

highlight:
  anchorLineNos: true
  codeFences: true
  guessSyntax: true
  lineNos: true
  lineNumbersInTable: true
  noClasses: false

注意： 这里的参数配置是全部替换的，不是追加哦。

Bilibili视频与音乐

不需要做任何的配置，只要在文章中需要使用的位置中插入bilibili或music短代码即可，参考如下：

# Bilibili视频
{
  {< bilibili BV1Sx411T7QQ >}}
或者
{
  {< bilibili id=BV1Sx411T7QQ >}}

# 音乐播放

{
  {< music server="netease" type="playlist" id="7273286178" autoplay="true" list-max-height="140" >}}

二级导航菜单

支持在Gemini和Pisces模式中使用二级导航菜单显示更多，只需要在配置文件中进行菜单的配置即可，参考如下：

menu:
  main:
    - identifier: example
      name: Example
      pre: angles-down
      weight: 4
    - identifier: syntax
      name: Syntax Highlighting
      pageRef: /post/09-syntax-highlighting
      weight: 1   
      parent: example
    - identifier: math
      name: Math Formula
      pageRef: /post/10-math-formula
      weight: 2   
      parent: example
      parent: example
    - identifier: flow-charts
      name: Flow Charts
      pageRef: /post/11-mermaid-charts
      weight: 3
      parent: example

提示： 这里的pageRef是用来指定本站点文章的目录相对链接，如果是外部链接，直接使用url参数即可。

最后实际的效果可以参考：二级菜单

Github风格警告

配置文件更新

需要在配置文件中增加postAlerts的配置项，可以根据自己的需求调整颜色和图标，参考如下：

postAlerts:
  info:
    icon: "circle-info"
    color: "#4A90E2"
  note:
    icon: "bell"
    color: "#17A2B8"
  help:
    icon: "circle-question"
    color: "#967ADC"
  error:
    icon: "circle-xmark"
    color: "#DC3545"
  warning:
    icon: "triangle-exclamation"
    color: "#F39C12"
  success:
    icon: "circle-check"
    color: "#32CD32"
  important:
    icon: "circle-plus"
    color: "#007BFF"

i18n文件更新（可选）

在站点的i18n目录下创建对应的语言配置文件，增加PostAlert的配置项，可按自己的需求调整说明描述，参考如下：

PostAlert:
  info     : "信息"
  note     : "注意"
  help     : "帮助"
  error    : "错误"
  warning  : "警告"
  success  : "成功"
  important: "重要"

使用方式

在写文章时直接使用Markdown语法即可，参考如下：

> [!INFO]
> `HugoNexT` 主题支持自定义样式设计，你可实现属于自己站点的个性化设计。

实际的渲染效果可以参考此文中的各种警告信息输出。

阅读更多按钮

无须做任何的配置，根据文章内容中的阅读更多按钮跳转时，会自动定位到后续内容的位置，具体的效果在访问此文时可以看到。

Waline3

由于Waline2和Waline3无法直接升级，所以在把他们两个都保留了，在使用时建议选择其中一个使用即可。比如需要使用Waline3，那就把配置文件中的Waline参数配置项关闭，然后增加如下的配置项：

waline3:
  placeholder: "请文明发言哟 ヾ(≧▽≦*)o"
  sofa: "快来发表你的意见吧 (≧∀≦)ゞ"
  emoji: false
  search: true
  imgUploader: false
  wordLimit: 200
  requiredMeta: ['nick', 'mail']
  reaction: true
  reactionText: [ '点赞', '踩一下', '得意', '不屑', '尴尬', '睡觉']
  reactionTitle: "你认为这篇文章怎么样？"
  serverURL: #<your waline server url>

注意： 其他位置有引用应对的Waline功能配置，也是需要更新为waline3，比如文章访问统计和评论统计。

文章分享

在配置文件中找到share配置项，删除掉旧的addthis配置项，然后增加如下的配置项：

  # 有数据统计功能，更多信息与配置，请参考：https://sharethis.com
  # sharethis:
  #   id: #<sharethis_id> 
  # 简单的在线分享，没有统计数据功能，更多信息可参考：https://www.addtoany.com/
  addtoany:    
    locale: zh-CN
    num_services: 8

后续在文章的底部会显示出分享的图标，用户可以选择自己喜欢的分享方式进行分享。

总结

时隔将近半年多的时间，总算是完成了Hugo NexT的大版本发布，个人的时间精力有限，能够坚持把这个主题持续开发下去，也需要感谢各位的支持和关注。在此非常感谢各位的反馈和建议，也希望大家能够喜欢和使用Hugo NexT主题。:beer: