hugo主题美化功能admonition

2023-06-26 15:58:27 浏览数 (1)

警告

本文最后更新于 2022-10-28,文中内容可能已过时。

admonition

admonition,是FixIt/LoveIt系列主题集成的短代码功能,有着炫酷的效果,可以美化文章笔记,但它并不是Markdown的标准语法,不能被Markdown正常渲染,需要额外的配置。类似样式效果很多笔记软件的插件也有,不过代码形式和展示样式不完全一样,大多类似。

有人喜欢它的优美的展示效果,有人觉得它是对Markdown语法的污染,使用因人而异。

admonition shortcode 有以下命名参数:

  • type [必需]第一个位置参数) admonition 横幅的类型,默认值是 note
  • title [可选]第二个位置参数) admonition 横幅的标题,默认值是 type 参数的值。(支持 markdown)
  • open [可选]第三个位置参数) 横幅内容是否默认展开,默认值是 true

hugo的LoveIt,FixIt主题都集成了admonition shorcode功能,可以比较方便的进行使用,语法和样式效果如下。 一个admonition示例:

1 2 3 4 5 6 7

{{< admonition type=tip title="This is a tip" open=false >}} 一个 **提示** 横幅 {{< /admonition >}} 或者 {{< admonition tip "This is a tip" false >}} 一个 **提示** 横幅 {{< /admonition >}}

显示效果如下:

Tip

一个 提示 横幅

12种样式代码和效果

note

1 2 3

{{< admonition >}} 一个 **注意** 横幅 {{< /admonition >}}

注意

一个 注意 横幅

tip

1 2 3

{{< admonition tip>}} 一个 **提示** 横幅 {{< /admonition >}}

技巧

一个 提示 横幅

abstract

1 2 3

{{< admonition abstract>}} 一个 **摘要** 横幅 {{< /admonition >}}

摘要

一个 摘要 横幅

info

1 2 3

{{< admonition info >}} 一个 **信息** 横幅 {{< /admonition >}}

信息

一个 信息 横幅

success

1 2 3

{{< admonition success >}} 一个 **成功** 横幅 {{< /admonition >}}

成功

一个 成功 横幅

question

1 2 3

{{< admonition question >}} 一个 **问题** 横幅 {{< /admonition >}}

问题

一个 问题 横幅

warning

1 2 3

{{< admonition warning >}} 一个 **警告** 横幅 {{< /admonition >}}

警告

一个 警告 横幅

failure

1 2 3

{{< admonition failure >}} 一个 **失败** 横幅 {{< /admonition >}}

失败

一个 失败 横幅

danger

1 2 3

{{< admonition danger >}} 一个 **危险** 横幅 {{< /admonition >}}

危险

一个 危险 横幅

bug

1 2 3

{{< admonition bug >}} 一个 **Bug** 横幅 {{< /admonition >}}

Bug

一个 Bug 横幅

example

1 2 3

{{< admonition example >}} 一个 **示例** 横幅 {{< /admonition >}}

示例

一个 示例 横幅

quote

1 2 3

{{< admonition quote >}} 一个 **引用** 横幅 {{< /admonition >}}

0 人点赞