Cards

The cards shortcode displays your content in a grouped set of cards.

  • Terminal Example

    For guys who like to tinker around.

    echo "Hello World!"
  • C Example

    For the connoisseur of programming.

    printf("Hello World!");

Usage

{{< cards >}}
{{% card title="Python Example" href="https://example.com" %}}
The AI native programming language.

```python
print("Hello World!")
```
{{% /card %}}
{{% card title="Terminal Example" %}}
For guys who like to tinker around.

```bash
echo "Hello World!"
```
{{% /card %}}
{{% card title="C Example" %}}
For the connoisseur of programming.

```c
printf"Hello World!");
```
{{% /card %}}
{{< /cards >}}
{{ partial "shortcodes/cards.html" (dict
  "page"  .
  "content" (slice
    (dict
      "href" "https://example.com"
      "title" "Pyhton Example"
      "content" ("The AI native programming language.\n\n```python\nprint(\"Hello World!\")\n```" | .RenderString)
    )
    (dict
      "title" "Terminal Example"
      "content" ("For guys who like to tinker around.\n\n```bash\necho \"Hello World!\"\n```" | .RenderString)
    )
    (dict
      "title" "C Example"
      "content" ("For the connoisseur of programming.\n\n```c\nprintf(\"Hello World!\");\n```" | .RenderString)
    )
  )
)}}

If you just want a single card you can instead call the card shortcode standalone.

Also follow the above link to see the parameter for each nested card.

Parameter

Name Default Notes
title <empty> Arbitrary title written in front of the tab view.
template default The template to be used to display all cards in the set. Can be overridden for each card.

- default: The standard layout
- debug: A debug layout helping you in development

See the card shortcode how to use your own templates.
<content> <empty> Arbitrary number of cards defined with the card sub-shortcode.

Examples

Lots of Cards

{{< cards >}}
{{% card title="Python" %}}
The AI native programming language.
{{% /card %}}
{{% card title="Terminal" %}}
For guys who like to tinker around.
{{% /card %}}
{{% card title="C" %}}
For the connoisseur of programming.
{{% /card %}}
{{% card title="C++" %}}
For the guys that can cope with syntax.
{{% /card %}}
{{% card title="C#" %}}
For guys that need two destructors.
{{% /card %}}
{{< /cards >}}
  • Python
    The AI native programming language.
  • Terminal
    For guys who like to tinker around.
  • C
    For the connoisseur of programming.
  • C++
    For the guys that can cope with syntax.
  • C#
    For guys that need two destructors.

Lots of Cards with Templates

{{< cards  template="debug" >}}
{{% card title="Python" %}}
The AI native programming language.
{{% /card %}}
{{% card title="Terminal" template="default" %}}
For guys who like to tinker around.
{{% /card %}}
{{% card title="C" %}}
For the connoisseur of programming.
{{% /card %}}
{{% card title="C++" %}}
For the guys that can cope with syntax.
{{% /card %}}
{{% card title="C#" %}}
For guys that need two destructors.
{{% /card %}}
{{< /cards >}}
    Python

    All Parameter

    {
      "color": "",
      "content": "\u003cp\u003eThe AI native programming language.\u003c/p\u003e",
      "href": "",
      "hrefattributes": {},
      "icon": "",
      "image": "",
      "imageattributes": {},
      "page": {
        "PageWithoutContent": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "TableOfContentsProvider": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "MarkupProvider": 0,
        "ContentProvider": 0
      },
      "params": {},
      "style": "filled",
      "template": "debug",
      "title": "Python"
    }

  • Terminal
    For guys who like to tinker around.
  • C

    All Parameter

    {
      "color": "",
      "content": "\u003cp\u003eFor the connoisseur of programming.\u003c/p\u003e",
      "href": "",
      "hrefattributes": {},
      "icon": "",
      "image": "",
      "imageattributes": {},
      "page": {
        "PageWithoutContent": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "TableOfContentsProvider": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "MarkupProvider": 0,
        "ContentProvider": 0
      },
      "params": {},
      "style": "filled",
      "template": "debug",
      "title": "C"
    }

    C++

    All Parameter

    {
      "color": "",
      "content": "\u003cp\u003eFor the guys that can cope with syntax.\u003c/p\u003e",
      "href": "",
      "hrefattributes": {},
      "icon": "",
      "image": "",
      "imageattributes": {},
      "page": {
        "PageWithoutContent": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "TableOfContentsProvider": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "MarkupProvider": 0,
        "ContentProvider": 0
      },
      "params": {},
      "style": "filled",
      "template": "debug",
      "title": "C++"
    }

    C#

    All Parameter

    {
      "color": "",
      "content": "\u003cp\u003eFor guys that need two destructors.\u003c/p\u003e",
      "href": "",
      "hrefattributes": {},
      "icon": "",
      "image": "",
      "imageattributes": {},
      "page": {
        "PageWithoutContent": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "TableOfContentsProvider": {
          "Date": "0001-01-01T00:00:00Z",
          "Lastmod": "0001-01-01T00:00:00Z",
          "PublishDate": "0001-01-01T00:00:00Z",
          "ExpiryDate": "0001-01-01T00:00:00Z",
          "Aliases": null,
          "BundleType": "branch",
          "Description": "Show content in a set of cards",
          "Draft": false,
          "IsHome": false,
          "Keywords": null,
          "Kind": "section",
          "Layout": "",
          "LinkTitle": "Cards",
          "IsNode": true,
          "IsPage": false,
          "Path": "/shortcodes/cards",
          "Slug": "",
          "Lang": "en",
          "IsSection": true,
          "Section": "shortcodes",
          "Sitemap": {
            "ChangeFreq": "",
            "Priority": -1,
            "Filename": "sitemap.xml",
            "Disable": false
          },
          "Type": "shortcodes",
          "Weight": 0
        },
        "MarkupProvider": 0,
        "ContentProvider": 0
      },
      "params": {},
      "style": "filled",
      "template": "debug",
      "title": "C#"
    }