Question Groups

Question groups let you visually bundle related fields together under a shared heading and description. They make long forms easier to navigate by creating clear sections, and they support features like collapsible panels and conditional visibility for the entire group.

What Question Groups Are

A question group is a container that wraps multiple form fields into a single visual section. Each group has its own heading, optional description text, and visual styling (border, background, padding). Fields inside a group are visually indented and connected, making it clear they belong together.

Groups are purely organizational: they do not affect how response data is structured. Each field inside a group still submits its own value independently. Think of groups as a layout tool, not a data tool.

Creating a Group

1. In the form editor, click Add Field in the left panel.
2. Scroll to the Layout section and drag Question Group onto your form canvas.
3. A new group container appears with a placeholder heading. Click the heading to edit it (e.g., "Contact Information" or "Shipping Details").
4. Optionally add a description below the heading to provide context (e.g., "Please enter your shipping address exactly as it appears on your mailbox.").

Adding Fields to Groups

There are two ways to add fields to an existing group:

• Drag into the group: Drag a new field from the left panel and drop it inside the group container. A blue highlight indicates valid drop zones within the group.
• Move existing fields: Drag an existing field on the canvas into the group. You can also drag fields out of a group to ungroup them.

Fields within a group can be reordered by dragging them up or down. The group heading always stays at the top.

Group Styling

Click on a group container and open the Style panel on the right to customize its appearance:

• Border: Toggle the group border on or off. When enabled, choose the border color, width (1-4px), and radius (sharp corners to fully rounded).
• Background: Set a background color for the group. Use subtle tints to differentiate sections (e.g., a light blue background for the billing section).
• Padding: Adjust the internal spacing between the group border and its fields. Options range from compact (12px) to spacious (32px).
• Heading style: Customize the heading font size, weight, and color independently from the form's global typography.

Collapsible Groups

For long forms, you can make groups collapsible so respondents can expand only the section they are working on.

1. Select the group and open its settings panel on the right.
2. Toggle Collapsible to on.
3. Choose the default state: Expanded (fields visible on load) or Collapsed (fields hidden until the respondent clicks the heading).

When collapsed, only the group heading and a chevron icon are visible. Clicking the heading toggles the group open with a smooth animation. This is especially useful for accordion-style forms where you want to reduce visual overwhelm.

Conditional Group Visibility

You can show or hide an entire group based on conditions: just like individual field visibility, but applied to the whole group at once.

1. Select the group and go to the Logic section in the settings panel.
2. Click Add condition.
3. Set a rule, for example: If "Order type" is "International", then show the "Customs Information" group.

When the condition is not met, the entire group and all its fields are hidden. If a group is hidden when the form is submitted, none of the fields inside it are included in the response: they are treated as if they do not exist.

Use Cases

• Long registration forms: Group fields into sections like "Personal Information," "Company Details," and "Preferences" so respondents know where they are.
• Order forms: Separate "Billing Address" and "Shipping Address" into distinct groups with a checkbox to copy billing to shipping.
• Multi-topic surveys: Group questions by topic (e.g., "Work Environment," "Management," "Benefits") with collapsible sections.
• Conditional sections: Show an "Accessibility Requirements" group only if someone selects "Yes" to "Do you have accessibility needs?"
• Progressive disclosure: Start with all groups collapsed except the first one. As respondents complete each section, the next group auto-expands.

Tip: Question groups work in both Survey Mode (one-at-a-time) and Open Canvas mode. In Survey Mode, each group is treated as a single step: all fields in the group appear together on one screen.