Doks

Link Card

Use the link-card shortcode to create a navigational card with a title, optional description, and an arrow pointing to a URL. Link cards can stand alone or be grouped inside a card-grid.

Usage

{{< link-card title="Getting started" href="/docs/start-here/" >}}

With a description:

{{< link-card
  title="Getting started"
  description="Install Doks and set up your first project."
  href="/docs/start-here/"
>}}

Parameters

ParameterTypeDefaultDescription
hrefstring—Required. Destination URL.
titlestring—Required. Card heading text.
descriptionstring—Short subtitle displayed below the title.
targetstring—Link target, e.g. _blank to open in a new tab.
relstring—Link rel attribute, e.g. noopener noreferrer.
classstring—Additional CSS classes on the card element, e.g. w-50.

Examples

Preview
Shortcodes

Explore all available shortcodes.

{{< link-card
  title="Shortcodes"
  description="Explore all available shortcodes."
  href="/docs/basics/shortcodes/"
>}}
Preview
Install

Set up a new Doks project.

Configuration

Customize your site settings.

{{< card-grid >}}
{{< link-card title="Install" description="Set up a new Doks project." href="/docs/start-here/installation/" >}}
{{< link-card title="Configuration" description="Customize your site settings." href="/docs/start-here/configuration/" >}}
{{< /card-grid >}}

Open in a new tab

{{< link-card
  title="Hugo docs"
  description="Official Hugo documentation."
  href="https://gohugo.io/documentation/"
  target="_blank"
  rel="noopener noreferrer"
>}}
Prev
Card
Next
Card Grid