Bootstrap 手风琴短代码

用于构建垂直手风琴的短代码,FAQ 是最常见的用例。

语法

1{{< bs/accordion >}}

参数

data

索引名称类型必填默认值版本示例
#0datastring---

不带扩展名的数据文件名称。

flush

索引名称类型必填默认值版本示例
-flushboolean-false--

true 时,去除边框和圆角,使手风琴与其父容器的边对边呈现。

alwaysOpen

索引名称类型必填默认值版本示例
-alwaysOpenboolean-false--

true 时,当另一个条目打开时,使手风琴条目保持打开状态。

数据文件映射

PathData
data/faq.yamlfaq
data/faq.tomlfaq
data/faq.jsonfaq
data/sub/faq.yamlsub.faq
data/sub/faq.tomlsub.faq
data/sub/faq.jsonsub.faq

数据条目属性

title

名称上下文类型必填默认值版本示例
title-string----

标题。

content

名称上下文类型必填默认值版本示例
content-string----

内容,支持 Markdown。

weight

名称上下文类型必填默认值版本示例
weight-string----

权重,值越小权重越高。

show

名称上下文类型必填默认值版本示例
show-string----

默认显示第一个条目,不过你可以通过该属性改变。

数据文件示例

data/accordion/faq.yaml
1- title: Q1
2  content: __A1__, ...
3- title: Q2
4  content: __A2__, ...

示例

默认手风琴示例

源码
1{{< bs/accordion "accordion.faq" >}}
结果

A1, …

A2, …

Flush 手风琴示例

源码
1{{< bs/accordion data="accordion.faq" flush=true >}}
结果

A1, …

A2, …

总是打开的 Flush 手风琴示例

源码
1{{< bs/accordion data="accordion.faq" flush=true alwaysOpen=true >}}
结果

A1, …

A2, …