What are Cards sections and how do the two types differ?
Cards sections present information in a structured layout using rectangular cards. There are two variants with different functionality.
Content Cards
Card content: Each card has a header and a rich text body (supports bold, links, and bullet points).
Photo handling: An optional image appears as its own card in the grid, sitting side by side with your text cards at the same size.
Background: No background customization. The section uses your page's default background.
Layout: Always a responsive grid regardless of card count.
CTA buttons: Primary and secondary with customizable text, link, and color.
Best for: Describing services, listing benefits, telling a story alongside a property photo, or any layout where written content is the focus.
Feature Cards
Card content: Each card has a title, description, and a list of up to 6 features with icons and short labels.
Photo handling: Photo or color fills the entire section background behind all cards. A dark overlay is automatically applied for readability.
Background: Supports background color, background image, or both.
Layout: Responsive grid for 3 or fewer cards. Switches to a horizontal scrollable carousel with navigation arrows for more than 3 cards.
Eyebrow title: Small label above the section heading (not available on Content Cards).
CTA buttons: Primary and secondary with customizable text, link, and color.
Best for: Comparing property types, listing amenities side by side, showcasing booking tiers, or layouts where quick visual scanning with icons matters more than detailed text.
How do I add a Cards section?
Go to app.wander.com → Website (left menu) → Pages.
Select the page you want to edit.
Click the + Section button and select Cards under the Basics group.
Choose your variant: Content Cards or Feature Cards.
Click the section in the page preview to open the editing sidebar.
What can I customize on Content Cards?
Title: Section heading displayed above the cards.
Description: Supporting text below the title.
Image: A photo displayed as its own card in the grid alongside your text cards. Toggle visibility on or off.
Primary and Secondary CTA Buttons: Each with customizable text, link, and color.
Cards: Each card has a Header and Body Text. Body text supports rich text formatting (bold, links, lists).
What can I customize on Feature Cards?
Eyebrow Title: Small label above the section title.
Title: Section heading.
Description: Supporting text below the title.
Background Color: Set a solid background color for the section.
Background Image: Upload an image that fills the entire section behind the cards. A dark overlay is automatically applied for readability.
Primary and Secondary CTA Buttons: Each with customizable text, link, and color.
Cards: Each card includes:
Title and Description at the top of the card
Features: A list of up to 6 items, each with an icon (from the icon picker) and a title
Note: Feature Cards display a maximum of 6 feature items per card. Additional items beyond 6 will not appear.
How should I format my button links?
For details on how to format internal page links vs. external URLs for buttons and CTAs, see the How do I format links in WanderOS? article.
How does the layout change based on card count?
Content Cards: Always displays in a responsive grid. With 1 card, it fills the full width. With 2, it splits into two columns. With 3, it uses three columns. The optional photo card takes up space in the grid alongside the text cards.
Feature Cards:
3 or fewer cards: Displays in a responsive grid (1, 2, or 3 columns).
More than 3 cards: Switches to a horizontal scrollable carousel with left/right navigation arrows on desktop. On mobile, cards always scroll horizontally regardless of count.
Tips
Keep text length consistent across cards. Cards with similar content length create a balanced, professional appearance. Uneven cards look unfinished.
Use Feature Cards for comparisons. Comparing booking tiers, property types, or service packages works well with the icon-and-feature format.
Use Content Cards for storytelling. Pair a photo of your property with cards describing the experience, amenities, or neighborhood highlights.
Common use cases: Service comparisons, property type breakdowns, neighborhood guides, booking benefit highlights, "Why book direct" sections.