前往小程序,Get更优阅读体验!
立即前往
发布
社区首页 >专栏 >HugoNexT4.7.2 新功能和升级提示

HugoNexT4.7.2 新功能和升级提示

作者头像
凡梦星尘
发布2025-02-28 17:38:04
发布2025-02-28 17:38:04
770
举报
文章被收录于专栏:Hugo博客Hugo博客

总结摘要

此次发布的Hugo NexT版本改动的内容稍为有点多,借助本站的升级历程做些记录,并分享给众多的用户,希望大家能够喜欢它 🥰。

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

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

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

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

重要

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

配置更新

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

多国语言切换

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

配置文件更新

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

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

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-cnen-us是要和i18n下面的语言配置文件名称保持一致,才能让页面中的各项翻译生效。

文章发布

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

1 2 3 4 5 6 7 8 9 10 11 12

# 文件夹管理(推荐) 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的配置项,在其下面增加summaryexpired的参数配置,参考如下:

1 2 3 4 5

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

信息

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

i18n文件更新(可选)

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

1 2 3 4 5

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

信息

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

代码块折叠

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

1 2 3 4 5 6 7

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

警告

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

Bilibili视频与音乐

不需要做任何的配置,只要在文章中需要使用的位置中插入bilibilimusic短代码即可,参考如下:

1 2 3 4 5 6 7 8

# Bilibili视频 {{< bilibili BV1Sx411T7QQ >}} 或者 {{< bilibili id=BV1Sx411T7QQ >}} # 音乐播放 {{< music server="netease" type="playlist" id="7273286178" autoplay="true" list-max-height="140" >}}

二级导航菜单

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

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

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的配置项,可以根据自己的需求调整颜色和图标,参考如下:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

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的配置项,可按自己的需求调整说明描述,参考如下:

1 2 3 4 5 6 7 8

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

使用方式

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

1 2 3

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

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

阅读更多按钮

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

Waline3

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

1 2 3 4 5 6 7 8 9 10 11 12

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配置项,然后增加如下的配置项:

1 2 3 4 5 6 7

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

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

总结

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

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

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

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

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

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 配置更新
  • 多国语言切换
    • 配置文件更新
    • 文章发布
  • 总结摘要与过期提示
    • 配置文件更新
    • i18n文件更新(可选)
  • 代码块折叠
  • Bilibili视频与音乐
  • 二级导航菜单
  • Github风格警告
    • 配置文件更新
    • i18n文件更新(可选)
    • 使用方式
  • 阅读更多按钮
  • Waline3
  • 文章分享
  • 总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档