Seventh > Cards > Links card

Links card

The Links card block displays a titled list of navigation links on a card, with optional background image or video. Perfect for menus, quick links, or curated navigation lists within card-based sections.

What it does

This block displays a card with:

  • A title heading
  • A list of menu links
  • Optional background image or video
  • Configurable card sizing and styling
  • Typography controls for the title and links

Block settings explained

Content

Heading

  • Text shown at the top of the card.

Hide heading on hover

  • Hide or show the heading when the user hovers or taps on the card.

Menu

  • Select a navigation menu to display.
  • Each menu item becomes a link in the list.
  • If empty, the card shows only the title.
  • Submenus are not shown.

Heading typography

Font

  • Body - Theme body font
  • Headings - Theme heading font (default)
  • Accent - Theme accent font

Text Size (Options depend on font selection)

When font is "Headings" or "Accent":

  • Heading 1 to Heading 6

When font is "Body":

  • LargeXLargeXXLarge

Text Size

  • Medium (default)
  • Large
  • XLarge

Reduced text opacity

  • When enabled: Links appear with reduced opacity.
  • When disabled: Links use full opacity.

Links are using "Body" font family.


Background

Image

  • Upload an image to use as the card background.

Video

  • Upload a video to use as the card background.
  • Overrides the image if both are set.

Media overlay

  • Adds a color overlay over the image/video.
  • Supports transparency (alpha).
  • Default: subtle black overlay.

Card Style

Text alignment

  • Aligns links (left, center, right).

Inner blocks spacing

  • Controls spacing between links.

Add padding to media

  • Adds padding around the card's background media.

Corner radius

  • Controls corner rounding for the card.

Color scheme

  • Selects the card color scheme.

Card height

  • Sets a minimum height for the card, no matter how much content does the card hold.
  • The card's height will always increase to fit all the links that are inside.

Common use cases

Quick navigation menus

Create lists of important links such as collections, pages, or support resources.

Brand directories

Link to partner brands, stockists, or external resources.

Campaign landing pages

Guide visitors to specific pages during promotions or launches.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.