From b096d35b856451385248bd8fec6b25822b9d7a62 Mon Sep 17 00:00:00 2001 From: Alex Haslam Date: Sat, 31 Jan 2026 19:38:19 +0000 Subject: [PATCH 1/9] Implement accordion shortcode --- layouts/shortcodes/accordion.html | 6 +++++ layouts/shortcodes/accordionItem.html | 37 +++++++++++++++++++++++++++ 2 files changed, 43 insertions(+) create mode 100644 layouts/shortcodes/accordion.html create mode 100644 layouts/shortcodes/accordionItem.html diff --git a/layouts/shortcodes/accordion.html b/layouts/shortcodes/accordion.html new file mode 100644 index 00000000..cf20c79a --- /dev/null +++ b/layouts/shortcodes/accordion.html @@ -0,0 +1,6 @@ +{{ $id := delimit (slice "accordion" (partial "functions/uid.html" .)) "-" }} +{{ $mode := .Get "mode" | default "collapse" }} + +
+ {{- .Inner -}} +
diff --git a/layouts/shortcodes/accordionItem.html b/layouts/shortcodes/accordionItem.html new file mode 100644 index 00000000..f4ebbbc9 --- /dev/null +++ b/layouts/shortcodes/accordionItem.html @@ -0,0 +1,37 @@ +{{ $parent := .Parent }} +{{ $groupID := "" }} +{{ $mode := "collapse" }} +{{ if $parent }} + {{ $groupID = delimit (slice "accordion" (partial "functions/uid.html" $parent)) "-" }} + {{ $mode = $parent.Get "mode" | default "collapse" }} +{{ else }} + {{ $groupID = delimit (slice "accordion" (partial "functions/uid.html" .)) "-" }} +{{ end }} + +{{ $id := delimit (slice "accordion-item" (partial "functions/uid.html" .)) "-" }} +{{ $title := .Get "title" | default (.Get "header") }} +{{ $open := .Get "open" | default false }} +{{ $isOpen := or (eq $open true) (eq $open "true") }} + +
+ + +
+
+ {{- .Inner | markdownify -}} +
+
+
From 82a593e0ed598fe7ab8e5bb428311cd7c51597cb Mon Sep 17 00:00:00 2001 From: Alex Haslam Date: Sat, 31 Jan 2026 19:38:23 +0000 Subject: [PATCH 2/9] Add to docs --- exampleSite/content/docs/shortcodes/index.md | 43 ++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/exampleSite/content/docs/shortcodes/index.md b/exampleSite/content/docs/shortcodes/index.md index 7fd16773..92355f29 100644 --- a/exampleSite/content/docs/shortcodes/index.md +++ b/exampleSite/content/docs/shortcodes/index.md @@ -96,6 +96,49 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol > [!INFO]- Customize admonition > See the [admonition customization guide](https://github.com/nunocoracao/blowfish/blob/main/layouts/_default/_markup/render-blockquote.html). +## Accordion + +`accordion` creates a collapsible set of panels. Use the `accordionItem` sub-shortcode to define each item. You can control whether multiple items can be open at the same time using the `mode` parameter. + + +| Parameter | Description | +| --------- | ------------------------------------------------------------------------------------------------- | +| `mode` | **Optional.** `collapse` (single open) or `open` (multiple open). Defaults to `collapse`. | + + +`accordionItem` parameters: + + +| Parameter | Description | +| --------- | --------------------------------------------------------------------------------------------------- | +| `title` | **Required.** Title shown in the item header. | +| `open` | **Optional.** Set to `true` to have the item open by default. | +| `header` | **Optional.** Alias for `title`, kept for compatibility with other shortcodes. | + + +**Example:** + +```md +{{}} + {{}} + Blowfish is a fast, configurable Hugo theme. + {{}} + + {{}} + Yes. Content inside items is Markdown and supports other shortcodes. + {{}} +{{}} +``` + +{{< accordion mode="open" >}} + {{< accordionItem title="What is Blowfish?" open=true >}} + Blowfish is a fast, configurable Hugo theme. + {{< /accordionItem >}} + + {{< accordionItem title="Can I use Markdown?" >}} + Yes. Content inside items is Markdown and supports other shortcodes. + {{< /accordionItem >}} +{{< /accordion >}}


From 7a9baa1c509ee1eacf43aefa1419f76ae4529a14 Mon Sep 17 00:00:00 2001 From: Alex Haslam Date: Sat, 31 Jan 2026 19:56:37 +0000 Subject: [PATCH 3/9] Update to use existing compiled classes --- layouts/shortcodes/accordion.html | 17 +++++++++++++ layouts/shortcodes/accordionItem.html | 36 ++++++--------------------- 2 files changed, 24 insertions(+), 29 deletions(-) diff --git a/layouts/shortcodes/accordion.html b/layouts/shortcodes/accordion.html index cf20c79a..07ef7f2c 100644 --- a/layouts/shortcodes/accordion.html +++ b/layouts/shortcodes/accordion.html @@ -4,3 +4,20 @@
{{- .Inner -}}
+{{ if eq $mode "collapse" }} + +{{ end }} diff --git a/layouts/shortcodes/accordionItem.html b/layouts/shortcodes/accordionItem.html index f4ebbbc9..4bea785c 100644 --- a/layouts/shortcodes/accordionItem.html +++ b/layouts/shortcodes/accordionItem.html @@ -1,37 +1,15 @@ -{{ $parent := .Parent }} -{{ $groupID := "" }} -{{ $mode := "collapse" }} -{{ if $parent }} - {{ $groupID = delimit (slice "accordion" (partial "functions/uid.html" $parent)) "-" }} - {{ $mode = $parent.Get "mode" | default "collapse" }} -{{ else }} - {{ $groupID = delimit (slice "accordion" (partial "functions/uid.html" .)) "-" }} -{{ end }} - -{{ $id := delimit (slice "accordion-item" (partial "functions/uid.html" .)) "-" }} {{ $title := .Get "title" | default (.Get "header") }} {{ $open := .Get "open" | default false }} {{ $isOpen := or (eq $open true) (eq $open "true") }} -
- -
+ From a975c43516de4775eafeb44df3c60149de30bdc0 Mon Sep 17 00:00:00 2001 From: Alex Haslam Date: Sat, 31 Jan 2026 19:59:38 +0000 Subject: [PATCH 4/9] Add example with collapse mode --- exampleSite/content/docs/shortcodes/index.md | 26 +++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/exampleSite/content/docs/shortcodes/index.md b/exampleSite/content/docs/shortcodes/index.md index 92355f29..47dee3fa 100644 --- a/exampleSite/content/docs/shortcodes/index.md +++ b/exampleSite/content/docs/shortcodes/index.md @@ -116,7 +116,7 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol | `header` | **Optional.** Alias for `title`, kept for compatibility with other shortcodes. | -**Example:** +**Example 1: `mode="open"` (multiple items can be open)** ```md {{}} @@ -140,6 +140,30 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol {{< /accordionItem >}} {{< /accordion >}} +**Example 2: `mode="collapse"` (only one item open at a time)** + +```md +{{}} + {{}} + First item content. + {{}} + + {{}} + Second item content. + {{}} +{{}} +``` + +{{< accordion mode="collapse" >}} + {{< accordionItem title="First item" open=true >}} + First item content. + {{< /accordionItem >}} + + {{< accordionItem title="Second item" >}} + Second item content. + {{< /accordionItem >}} +{{< /accordion >}} +


## Article From 750766a4452bcb5242b81c4f2b405fb6dd0a6b44 Mon Sep 17 00:00:00 2001 From: Alex Haslam Date: Sat, 31 Jan 2026 20:02:19 +0000 Subject: [PATCH 5/9] Add separated flag --- exampleSite/content/docs/shortcodes/index.md | 9 +++++---- layouts/shortcodes/accordion.html | 19 ++++++++++++++++++- layouts/shortcodes/accordionItem.html | 13 ++++++++++++- 3 files changed, 35 insertions(+), 6 deletions(-) diff --git a/exampleSite/content/docs/shortcodes/index.md b/exampleSite/content/docs/shortcodes/index.md index 47dee3fa..d81b5532 100644 --- a/exampleSite/content/docs/shortcodes/index.md +++ b/exampleSite/content/docs/shortcodes/index.md @@ -103,7 +103,8 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol | Parameter | Description | | --------- | ------------------------------------------------------------------------------------------------- | -| `mode` | **Optional.** `collapse` (single open) or `open` (multiple open). Defaults to `collapse`. | +| `mode` | **Optional.** `collapse` (single open) or `open` (multiple open). Defaults to `collapse`. | +| `separated` | **Optional.** `true` to show each item as a separate card. Defaults to `false` (joined list). | `accordionItem` parameters: @@ -116,10 +117,10 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol | `header` | **Optional.** Alias for `title`, kept for compatibility with other shortcodes. | -**Example 1: `mode="open"` (multiple items can be open)** +**Example 1: `mode="open"` (multiple items can be open) + `separated=true`** ```md -{{}} +{{}} {{}} Blowfish is a fast, configurable Hugo theme. {{}} @@ -130,7 +131,7 @@ The alert sign (`+` or `-`) is optional to control whether the admonition is fol {{}} ``` -{{< accordion mode="open" >}} +{{< accordion mode="open" separated=true >}} {{< accordionItem title="What is Blowfish?" open=true >}} Blowfish is a fast, configurable Hugo theme. {{< /accordionItem >}} diff --git a/layouts/shortcodes/accordion.html b/layouts/shortcodes/accordion.html index 07ef7f2c..d4ef39e0 100644 --- a/layouts/shortcodes/accordion.html +++ b/layouts/shortcodes/accordion.html @@ -1,9 +1,26 @@ {{ $id := delimit (slice "accordion" (partial "functions/uid.html" .)) "-" }} {{ $mode := .Get "mode" | default "collapse" }} +{{ $separated := .Get "separated" | default false }} +{{ $isSeparated := or (eq $separated true) (eq $separated "true") }} -
+
{{- .Inner -}}
+{{ if not $isSeparated }} + +{{ end }} {{ if eq $mode "collapse" }}