Bootstrap Toggle 短代碼

用於生成可切換的導航欄和標籤欄。

The config toggle is useful, but it’s limited to generate configuration code blocks in YAML, TOML and JSON languages. The toggle* shortcodes are designed to be more versatile.

Toggle

Toggle 參數

name

索引名稱類型必填默認值版本
#0namestring--

Toggle 的 ID 和名稱,每個頁面必須唯一。

style

索引名稱類型必填默認值版本
-stylestring-tabs-

樣式:tabspillsunderline

data

索引名稱類型必填默認值版本
-datastring---

條目數據文件名,當不使用嵌套短代碼時必填。

Toggle 條目

Toggle 條目參數

name

索引名稱類型必填默認值版本
#0namestring--

Toggle 的 ID 和名稱,每個頁面必須唯一。

style

索引名稱類型必填默認值版本
-stylestring-tabs-

樣式:tabspillsunderline

data

索引名稱類型必填默認值版本
-datastring---

條目數據文件名,當不使用嵌套短代碼時必填。

示例

數據文件示例

data/bootstrap/toggle-data-file.yaml
1- name: Foo
2  inner: "*Foo* Content with **Markdown**"
3
4- name: Bar
5  inner: "Bar Content without Markdown"
源碼
1{{< bs/toggle "data-file" "pills" "bootstrap.toggle-data-file" />}}
結果
Foo Content with Markdown
Bar Content without Markdown

嵌套示例

源碼
 1{{< bs/toggle foobar >}}
 2
 3  {{% bs/toggle-item Foo %}}
 4  *Foo* Content with **Markdown**
 5  {{% /bs/toggle-item %}}
 6
 7  {{< bs/toggle-item Bar >}}
 8  Bar Content without Markdown
 9  {{< /bs/toggle-item >}}
10
11{{< /bs/toggle >}}
結果

Foo Content with Markdown

Bar Content without Markdown

帶 Pills 樣式的 SDK 示例

源碼
 1{{< bs/toggle name=sdk style=pills >}}
 2
 3  {{< bs/toggle-item JS >}}
 4    {{< highlight js >}}
 5    console.log('hello world');
 6    {{< /highlight >}}
 7  {{< /bs/toggle-item >}}
 8
 9  {{< bs/toggle-item PHP >}}
10    {{< highlight php >}}
11    echo 'hello world';
12    {{< /highlight >}}
13  {{< /bs/toggle-item >}}
14  
15  {{< bs/toggle-item Go >}}
16    {{< highlight go >}}
17    fmt.Println("hello world")
18    {{< /highlight >}}
19  {{< /bs/toggle-item >}}
20
21{{< /bs/toggle >}}
結果
1console.log('hello world');
1echo 'hello world';
1fmt.Println("hello world")

帶下劃線樣式的非全寬、居中示例

源碼
1{{< bs/toggle name=underline style=underline fill=false alignment=center >}}
2  {{< bs/toggle-item Foo >}}Foo{{< /bs/toggle-item >}}
3  {{< bs/toggle-item Bar >}}Bar{{< /bs/toggle-item >}}
4{{< /bs/toggle >}}
結果
Foo
Bar