Browse Docs

Bootstrap Collapse Shortcode

HugoMods Authors Razon Yang March 24, 2023 2 min read Docs Shortcodes Bootstrap Collapse

Shortcode to show and hide content.

Donate

Become a backer or sponsor to support our work.

AFDIAN GitHub Sponsors PayPal
On this page
Sponsors
Bootstrap Collapse Shortcode

Syntax

1{{< bs/collapse >}}
2{{< /bs/collapse >}}

Parameters

heading

PositionNameTypeRequiredDefaultSinceExample
#0headingstring✓---

The heading.

style

PositionNameTypeRequiredDefaultSinceExample
#1stylestring-primary--

The style: primary, secondary, success, warning, info, danger, light, dark.

expand

PositionNameTypeRequiredDefaultSinceExample
#2expandstring-false--

Whether to expand by default.

border

PositionNameTypeRequiredDefaultSinceExample
-borderstring-truev0.21.0-

Whether to show border.

rounded

PositionNameTypeRequiredDefaultSinceExample
-roundedstring-truev0.21.0-

Whether to enable rounded border.

Examples

Steps Example

Source
 1{{< bs/collapse heading="1. Step One" expand=true >}}
 2First of all ...
 3{{< /bs/collapse >}}
 4
 5{{% bs/collapse "2. Step Two" secondary %}}
 6And then ...
 7{{% /bs/collapse %}}
 8
 9{{% bs/collapse "3. Step Three" success %}}
10**Well done**.
11{{% /bs/collapse %}}
Result
1. Step One
First of all …
And then …
Well done.

Files Example

Source
 1{{< bs/collapse heading="Configuration" expand=true >}}
 2  {{< bs/config-toggle hugo >}}
 3  params:
 4    message: "Hello world!"
 5  {{< /bs/config-toggle >}}
 6{{< /bs/collapse >}}
 7
 8{{% bs/collapse "Template" %}}
 9  ```go-html-template
10  <div class="greeting">
11    {{ site.Params.message }}
12  </div>
13  ```
14{{% /bs/collapse %}}
Result
Configuration

hugo.yaml

1params:
2  message: Hello world!

hugo.toml

1[params]
2  message = 'Hello world!'

hugo.json

1{
2   "params": {
3      "message": "Hello world!"
4   }
5}

1<div class="greeting">
2  {{ site.Params.message }}
3</div>

List Example

Source
11. Item one
22. Item two {{< bs/collapse heading="Inline" expand=true >}}_Inline_ markdown{{< /bs/collapse >}}
33. Item three {{< bs/collapse heading="Code block" expand=true >}}
4  ```sh
5  echo "Hello world"
6  ```
7  {{< /bs/collapse >}}
84. Item four
Result
  1. Item one
  2. Item two
    Inline
    Inline markdown
  3. Item three
    Code block
    1echo "Hello world"
  4. Item four
Clearfix
Config Toggle