hugo-theme-next/exampleSite/content/post/shortcodes.md
2022-08-09 09:37:59 +08:00

1.9 KiB
Raw Blame History

title description keywords date lastmod categories tags url
自定义短语示例 将常用的块引用、标签卡、按钮等信息设置成短代码,便于快速引用 shortcode,短代码 2022-08-06T14:41:50+08:00 2022-08-06T14:41:50+08:00
示例
短代码
语法
post/shortcodes.html

虽然 Markdown 语法已经非常丰富能够满足我们写文章的绝大部分需求,但是为更好的对文章内容进行更友好的排版,为引设计一套自定义的短语,便于在使用时能够快速引用。

块引用

在引用一些经典名言名句时,可以采用此短语,语法参考如下:

{{</* quote */>}}
  ### block quote
  写下你想表达的话语!
{{</* /quote */>}}

实际效果:

{{< quote >}}

希望是无所谓有,无所谓无的,这正如地上的路。

其实地上本没有路,走的人多了,也便成了路。

鲁迅

{{< /quote >}}

信息块

支持 defaultinfosuccesswarningdanger 等五种不同效果的展示,语法参考如下:

{{</* note [class] [no-icon] */>}}
  书写表达的信息
  支持 Markdown 语法
{{</* /note */>}}

实际效果:

{{< note default no-icon >}}

Default Header without icon

Welcome to Hugo NexT! {{< /note >}}

{{< note default >}}

Default Header

Welcome to Hugo NexT! {{< /note >}}

{{< note info >}}

Info Header

Welcome to Hugo NexT! {{< /note >}}

{{< note success >}}

Success Header

Welcome to Hugo NexT! {{< /note >}}

{{< note warning >}}

Warning Header

Welcome to Hugo NexT! {{< /note >}}

{{< note danger >}}

Danger Header

Welcome to Hugo NexT! {{< /note >}}