半神文章短代码示例

半神短代码兼容 Hugo 风格写法，也支持更轻的 ::: 容器写法。目标是让普通 Markdown 文章也能使用稳定的正文组件。

{{< note title="设计原则" type="info" >}}

短代码只做文章表达需要的组件，不把页面功能强塞进正文。静态站点无法可靠实现的回复可见和复杂加密，会降级为折叠提示块。

{{< /note >}}

{{< tip title="兼容写法" >}}

旧 Demius 的 button、collapse、tabs、timeline、linkcard、bilibili 等写法可以逐步迁移到半神。

{{< /tip >}}

{{< button href="/posts/" text="查看全部文章" color="primary" >}}

{{< linkcard url="https://github.com/uxiaohan/vhAstro-Theme" title="vhAstro-Theme" desc="参考文章能力、媒体展示和主题配置思路。" site="GitHub" >}}

{{< collapse title="折叠说明" open="true" >}}

折叠块适合放长说明、命令输出、配置片段或不想默认展开的内容。

• 支持 Markdown 列表
• 支持普通链接和代码
• 移动端不会撑破正文宽度

{{< /collapse >}}

{{< tabs >}}

{{< tab title="提示块" active="true" >}}

提示块适合强调信息，支持 info、tip、success、warning、danger。

{{< /tab >}}

{{< tab title="链接卡片" >}}

链接卡片适合替代裸链接，尤其是外链参考和站内文章引用。

{{< /tab >}}

{{< /tabs >}}

{{< timeline >}}

{{< timeline-item date="2026-06-08" title="短代码系统接入" type="success" >}}

通过 remark 插件在构建期把短代码转换成静态 HTML。

{{< /timeline-item >}}

{{< timeline-item date="2026-06-09" title="继续补充扩展" type="info" >}}

后续可以根据实际文章需要继续增加 Mermaid、相册组和下载卡片。

{{< /timeline-item >}}

{{< /timeline >}}

title="::: 容器写法"

这种写法更接近现代 Markdown 插件的容器语法，适合新文章直接使用。

{{< picture src="/og.svg" title="半神主题 OG 图" >}}

{{< badge text="半神短代码" color="primary" >}}

这一行展示 {{< color "accent" >}}主题色文字{{< /color >}} 的内联写法。