Card Group
Use the card-group shortcode to display a group of cards.
Use the card-group shortcode to display a group of cards. Add inner <card> elements for each card. As an example, the following shortcode displays a group of three cards.
Bootstrap framework
Build fast, responsive sites with Bootstrap 5. Easily customize your site with the source Sass files.
Full text search
Search your site with FlexSearch, a full-text search library with zero dependencies.
Development tools
Use Node Package Manager to automate the build process and to keep track of dependencies.
{{< card-group padding="3" gutter="3" >}}
{{< card title="Bootstrap framework" icon="fab bootstrap" >}}
Build fast, responsive sites with Bootstrap 5. Easily customize your site with the
source Sass files.
{{< /card >}}
{{< card title="Full text search" icon="fas magnifying-glass" >}}
Search your site with FlexSearch, a full-text search library with zero dependencies.
{{< /card >}}
{{< card title="Development tools" icon="fas code" >}}
Use Node Package Manager to automate the build process and to keep track of
dependencies.
{{< /card >}}
{{< /card-group >}}The shortcode supports the following arguments:
| Argument | Required | Description |
|---|---|---|
| cols | No | Number of columns for the grid, must be a value between “1” and “5”, or set to “auto” (new in
v0.19.0 |
| title | No | Optional title of the card group. |
| separator | No | Optional flag to indicate a horizontal line should be added between items on small screens. |
| gutter | No | v0.19.0 |
| responsive | No | Optional flag if the number of columns should be responsive, defaults to “true”. |
In addition, the following arguments are passed to the individual cards.
| Argument | Required | Description |
|---|---|---|
| class | No | Optional class attribute of the card element, e.g. “w-50”. |
| color | No | Optional theme color of the card, either “primary”, “secondary”, “success”, “danger”, “warning”, “info”, “light”, “dark”, or “body”. By default, no color is specified. |
| padding | No | Optional padding of the content, either “0”, “1”, “2”, “3” (default), “4”, “5”, or “auto”. |
| header | No | Optional header components of the card, displayed in small caps. Supported values are “full” (default), “publication”, “tags”, and “none”. |
| footer | No | Optional footer components of the card, displayed in small caps. Supported values are “full”, “publication”, “tags”, and “none” (default). |
| orientation | No | Optional placecement of the thumbnail, either “stacked” (default), “horizontal”, or “none”. |
See the card shortcode documentation for additional styling options.