hugo 主题 hextra 简介

#hugo

2025-02-22 13:45:18

hextra 是一个漂亮的 hugo 主题，本站使用的就是它，如果没意外，本站会一直长这样，毕竟我年纪逐渐大了，没时间折腾。

hextra 主题介绍

hextra github 地址是：https://github.com/imfing/hextra, 中文文档地址是：https://imfing.github.io/hextra/zh-cn/docs/ 官方的介绍是：

一个现代、快速且功能齐全的 Hugo 主题，基于 Tailwind CSS 构建。专为构建美观的文档、博客和网站而设计，它提供了开箱即用的功能和灵活性，以满足各种需求。

基础功能完善，比如数学公式、代码高亮、图表 mermaid、短代码

hextra 短代码介绍

短代码有：标签页、步骤、卡片、提示框、文件树等。

标签页

举个例子：

{{< tabs >}}

  {{< tab name="YAML" selected=true >}}
  ```json
  { "hello": "world" }
  ```
  {{< /tab >}}

  ... 类似地添加其他标签页

{{< /tabs >}}

hello: world

步骤条

举个例子：

{{% steps %}}

### 第一步

这是第一步。

### 第二步

这是第二步。

{{% /steps %}}

第一步

这是第一步。

第二步

这是第二步。

卡片实例

带蓝色标签的卡片

标签文本

提示框实例

🌐

Hugo 可用于创建各种类型的网站，包括博客、作品集、文档站点等。

1
2
3
{{< callout emoji="🌐" >}}
  Hugo 可用于创建各种类型的网站，包括博客、作品集、文档站点等。
{{< /callout >}}

请访问 GitHub 查看最新版本。

1
2
3
{{< callout type="info" >}}
  请访问 GitHub 查看最新版本。
{{< /callout >}}

文件树实例

- _index.md
- - _index.md
  - introduction.md
  - introduction.fr.md
hugo.toml

Markdown

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
{{< filetree/container >}}
  {{< filetree/folder name="content" >}}
    {{< filetree/file name="_index.md" >}}
    {{< filetree/folder name="docs" state="closed" >}}
      {{< filetree/file name="_index.md" >}}
      {{< filetree/file name="introduction.md" >}}
      {{< filetree/file name="introduction.fr.md" >}}
    {{< /filetree/folder >}}
  {{< /filetree/folder >}}
  {{< filetree/file name="hugo.toml" >}}
{{< /filetree/container >}}

最后更新于 2025-02-22 13:45:18

Golang - client 优雅关闭 grpc server 流 Golang - 解决 excelize 流式读调用 io.ReadAll 的问题