Cards

Tag: module:cards

Cards show links to other pages. One module can use a grid, a horizontal carousel or a filterable grid. The module page supplies the section heading and introduction when embedded in a landing page; the pages being listed supply the card content.

#Choose where the cards come from

Source setting on the module	Pages listed
No `source:` tag	Children of the Cards module page itself.
`source:page:SLUG`	Children of the named Basic source page, recent posts of a Blog, or upcoming events of a Calendar.
`source:tag:TAG`	Published pages carrying that page tag.

Replace SLUG or TAG with the real value. source:page:XXX is a pattern, not a literal tag to copy. For example, source:page:practice_resources would list items supplied by a page whose slug is practice_resources, if that source page exists.

Use one source. If page and tag sources are both present, the page source takes precedence. Changing the source page's slug requires updating the source tag too.

source-filter:VALUE narrows that source to items with a matching page tag or filter:VALUE label. It is applied before the item limit. It is different from the visitor-facing filter controls.

Choose the layout

Tags	Result
`module:cards` + `layout:grid`	Regular grid; the default layout.
`module:cards` + `layout:carousel`	Horizontal carousel.
`module:cards` + `layout:filter`	Grid with keyword search, category filters and sorting controls.

A grid defaults to 3 columns. Use columns:2, columns:3 or columns:4 to choose a desktop grid width; smaller screens adapt automatically. Column tags do not set the number of visible carousel slides.

For a subscription tile alongside a grid, add sidebar:subscribe. That grid defaults to two columns unless you supply columns: yourself. The sidebar is not supported with layout:carousel or layout:filter.

Carousel controls and tile cards

indicators:arrows is the default. To use dots, add indicators:dots, with a plural indicators. The spelling indicator:dots is not recognised by the checked theme.

Use card:tile for compact text tiles without a card image. A typical carousel section uses these as separate page tags:

module:cards
layout:carousel
card:tile
indicators:dots
source:page:practice_resources
limit:all
spacing:large
page_no_robots

Replace the example source slug with a page that exists in your website. Preview after changing variants or controls; a small collection may not need multiple carousel positions.

Card appearance

Tag on the Cards module	Appearance / content
`card:default`	Standard heading, summary and optional image.
`card:tile`	Text tile, without an image.
`card:news`	News treatment, including available author/date details.
`card:event`	Event treatment; use Event pages for event information.
`card:resource`	Resource treatment with available publish date/author.
`card:petition`	Petition treatment; use a Petition page for petition details.
`card:icon`	Icon treatment using the page's available NationBuilder icon. Icon setup should be confirmed with For Purpose.

A card variant changes presentation, not the underlying NationBuilder page type. Adding card:event does not turn Basic pages into Events. card:auto and card:basic are older aliases for card:default.

Edit an individual card

Open the destination page, rather than the Cards module:

Destination field	Card content
Headline; Name if empty	Card title.
Excerpt	Card summary and searchable description.
Social media image	Card image, except for tile/icon variants.
Page URL	Card destination, subject to membership access checks.
Published date / Author	Details used by variants that display them.
`filter:LABEL` tags	Category labels for the filter layout. Add one tag per category.

Attachments alone do not set the card image. The card normally links to the destination page, not directly to its PDF or another attachment.

Number and order of cards

Tag	Effect
`limit:6` or another positive whole number	Caps the number of cards. Grid/carousel default to 6.
`limit:all`	Shows all items supplied by the source; filter layout uses this by default.
`sort:auto`	Keeps the source's natural order; tag sources use newest first. Default.
`sort:manual`	Leaves the source collection's order unchanged; useful for manually ordered Basic children. Does not create a manual order for a tag collection.
`sort:newest`	Newest published date first.
`sort:oldest`	Oldest published date first.
`sort:alpha`	Alphabetical by Headline.

To manage a manually ordered set, use a Basic source page, put the card destinations beneath it, reorder those children and use sort:manual. Check the parent preview to confirm the result.

The filter layout searches only the cards loaded into this module, using their headings and excerpts. It does not search the whole website. A restrictive limit: or source-filter: can leave otherwise relevant pages out of the visitor's results.

Cards support shared styles and spacing, defaulting to spacing:large. There is currently no tag to enable a “See all” footer link.

Restricted destinations can still show a public card teaser, with the link changed to the joining page for visitors without access. See Access and search visibility before adding member-only resources.