Editing cards in the Website Builder

In the Website Builder, cards are the visual building blocks used to display repeating content — like posts, recommendations, or testimonials — within a block on your site. Each card is a templated layout that gets repeated for every item in that block, so changes you make to a card's design apply consistently across all items at once.

The card editor gives you a flexible, visual way to control how those cards look, including layout, styling, and the details that appear on each one, all while seeing your changes in real time.

---

What is a card?

A card is the visual layout for a single repeated item within a collection block. Depending on the block type, that item might be a blog post, a newsletter recommendation, or a testimonial. The card defines what information is shown and how it's arranged, then that layout is applied to every item in the block.

The most common card type is the post card, which displays individual posts within a Posts block. Other card types include:

• Recommendation cards: Display a newsletter recommendation with an image, name, description, sponsored label, and a follow option.
• Testimonial cards: Display a testimonial with the message, author image, author name, and description.

For details on post cards specifically, see How the Post page works in the Website Builder.

---

How the card editor works

When you open the card editor, the rest of your page stays loaded in the background while a focused editing view opens on the right for your selected card. A blurred overlay highlights the active card, and the card scrolls into view so you can see exactly what you're working with.

Any changes you make in the card editor apply to every card in that block — so your design stays consistent across all items without having to update each one individually.

A banner at the top of the canvas reminds you that any changes made to the post card will apply across the block. To exit the card editor, click anywhere outside of the focused card, or use the Exit option in the editing banner.

---

How to use the card editor

1. Open your site in the Website Builder.
2. Click on a block that contains cards (such as a Posts, Recommendations, or Testimonials block) to select it.
3. Scroll down the right panel, and click on Edit Post Card under Cards to open the card editor.
   
   
   

The card editor will open with the selected card in focus. The right panel will display the card settings, where you can make your changes.

---

Styling your cards

When the card editor is open, the right panel displays all available settings for your post card. At the top, you can adjust spacing and layout properties including padding, gap, direction, wrap, justify, and vertical alignment. 

One key setting is Position, which controls how card content elements are arranged:

• Relative: Content flows in the standard order, date and title on top, author below.
• Static: Displays the same as Relative.
• Absolute: Pulls the author out of the normal content flow and positions it above the title.
  
  
  

Scrolling down in the right panel reveals additional style settings:

• Fill: Set a background color and shadow for the card.
• Outline: Adjust the border style and corner radius.
• Visibility: Control which visitors can see the card.
• Hover effects: Add effects that trigger when a user hovers over the card.

When you select a content element inside a card — like a heading or paragraph — the action menu surfaces quick inline editing options for that block type. For headings and paragraphs, you can adjust heading level, format, color, and font size directly from the menu.

---

Using the action menu in the card editor

When you're editing inside a card, a floating action menu appears whenever you select an element. This gives you quick access to common structural actions right where you're working, without needing to use the right-hand design panel or insert panel.

From the action menu, you can:

• Select parent: Move the selection up to the parent element of the block you've selected. Useful for selecting a container when you've clicked into a nested element.
• Insert blocks: Open a dropdown to add new elements to your card. This shows the same options as the insert panel, so you can add text, images, and other content directly into the card layout.
• Move block up or down: Reorder elements within the card without dragging.
• Remove selected block: Delete the selected element from the card.

---

Current limitations

There are a few things to keep in mind when working with the card editor:

• Card style templates: The ability to save a card style as a reusable template is not available at this time, though it is on the roadmap.
• Dynamic fields: Certain placeholder text on cards (like dynamic fields that pull in live content data) is intentionally locked and cannot be edited directly in the card editor.

---

Frequently asked questions about editing cards in the Website Builder

Do card editor changes affect my whole site or just one block?
Changes apply to all cards within the block you're editing. They're consistent across your site wherever that block appears.
Can I style cards differently on different pages?
Not currently. Card settings apply globally to all instances of that block type across your site.
What's the difference between a card and a block?
A block is the container that holds a collection of repeating items (like a Posts block or Testimonials block). A card is the individual layout template for each item within that block.
Where can I learn more about post cards specifically?
For details on how post cards work, including post-specific display settings, see How the Post page works in the Website Builder.