Cards
Cards in Seventh: the styled containers inside sections that hold blocks, such as the Product card or the Promo card, and the page that documents each one.
Applies to: Seventh 4.0.0 and later. Added in: Seventh 1.0.0. Last checked: 2026-10-13 against Seventh 4.0.0.
A card is the middle level of a Seventh page: a section holds cards, and each card holds blocks. A card is a block that holds other blocks, with its own style: alignment, spacing, padding, corner radius and color scheme.
- Some cards read their content from a product, a collection or an article. Product grids, collection pages and search results use one card for every item they show, so you style it once.
- Other cards hold whatever blocks you add, for example the Blank card, the Promo card or the Rich text card.
Card pages
Product card
The Product card in Seventh shows a product with image, title, price, swatches and badges inside grids, sliders and mega menus.
Collection card
The Collection card in Seventh shows a collection with its image, title, product count and description in grids, lists and mega menus.
Article card
The Article card in Seventh shows a blog post with its image, title, excerpt, date, author and tags in blog grids and sections.
Promo card
The Promo card in Seventh adds a promotion card with media, text and a link at a chosen position inside collection and product grids.
Rich text card
The Rich text card in Seventh holds headings, text, buttons and optional media inside the Rich text grid section.
Shop the look card
The Shop the look card in Seventh shows an image with product and text hotspots that customers tap to see and buy the products.
Links card
The Links card in Seventh shows a list of large text links, each with an image that appears on hover, inside the Custom grid section.
Blank card
The Blank card is the basic Card block in Seventh: an empty card with its own style and media where you add any blocks.
Testimonial card
The Testimonial card in Seventh is a Card preset with a quote, a star rating and the testimonial author, used in the Testimonials section.
Related pages
- How Seventh is built: sections, cards and blocks: how the three levels fit together.
- Sections: every section you can add to a page.
- Blocks: every block you can add inside a section or card.
- Product card theme settings: the store-wide settings shared by all product cards.