Skip to main content
  1. Snippits/
  2. Blowfish Exemplars/
  3. Blowfish Shortcodes/

Carousel Leaf

<time datetime="2023-06-27 04:00:00 &#43;0000 UTC">June 27 2023</time><span class="px-2 text-primary-500">&middot;</span><time datetime="2024-02-20 16:00:25 -0600 CST">Updated: February 20 2024</time><span class="px-2 text-primary-500">&middot;</span><span>191 words</span><span class="px-2 text-primary-500">&middot;</span><span title="Reading time">1 min</span>
Blowfish Shortcodes Carousel
Hoof & Paw
The ART in Heart
Hoof & Paw
Crystalini Partum a Canis Stercore
blowfish shortcodes - This article is part of a series.
🐡 Shortcodes
carousel showcases multiple images in an interactive and visually appealing way

carousel allows a user to slide through multiple images while only taking up the vertical space of a single one. All images are displayed using the full width of the parent component using one of the predefined aspect ratios of 16:9, 21:9 or 32:9.

It’s important to note that carousel must be invoked from a leaf bundle page to be able to access images which reside in a subdirectory.

OTHERWISE carousel will only be able to access images in the same directory as the page which invoked it.


This page has no resources. Nothing to show!
Parameter Description
images Required. A regex string to match image names.
aspectRatio Optional. The aspect ratio for the carousel. Either 16-9, 21-9 or 32-9. It is set to 16-9 by default.
interval Optional. The interval for the auto-scrooling, specified in milliseconds. Defaults to 2000 (2s)

Example 1: 16:9 aspect ratio and verbose list of images

{{< carousel images="gallery/{01,02,04,03}.jpg" >}}

Example 2: 21:9 aspect ratio and regex-ed list of images

{{< carousel images="gallery/*" aspectRatio="21-9" interval="2500" >}}
blowfish shortcodes - This article is part of a series.