Shortcodes 使用指南

用 Hugo Shortcodes 让文章内容更清晰、更易维护。

作者: Liquid Stack

文章来源: https://liquid-stack.pages.dev/zh/p/using-shortcodes/

Shortcodes 是 Hugo 在 Markdown 中插入可复用结构的方式,适合提示框、嵌入内容和重复版式。

先看现有 Shortcodes

浏览 layouts/shortcodes/,了解主题已经提供的能力。优先复用现有组件,避免为一次性排版复制大段 HTML。

什么时候使用

当一段内容需要固定结构、会在多篇文章中重复,或必须渲染为 HTML 时,Shortcode 比手写重复代码更合适。普通段落、列表和代码块仍然直接使用 Markdown。

测试渲染结果

加入 Shortcode 后用本地预览检查桌面与移动端。若它依赖图片、视频或外部链接,也要检查资源路径与加载失败时的表现。

这篇文章对你有帮助吗?
  • 喜欢
  • 好笑
  • 思考
  • 惊讶
  • 难过
4 评论
  • 按正序
  • 按倒序
  • 按热度
Alex 2 天前

主页小组件很完整,替换示例内容后就可以直接使用。

Liquid Stack Author 2 天前

@Alex:

谢谢体验。示例内容、图片和链接都可以按自己的需要替换。

Momo 1 天前

@Liquid Stack:

中英文页面切换很自然,文章与页面结构也保持一致。

Liquid Stack Author 刚刚

@Momo:

评论、友链和管理后台都保留了完整入口,接入自己的服务后即可使用。

Powered by Waline