Components

FAQ Item

Clarity Meets SEO.

The FAQ Item component is purpose-built to present frequently asked questions in a clear, collapsible format while automatically generating SEO-optimized structured data (FAQPage schema). It improves your page’s search engine visibility while helping users quickly access the answers they’re looking for, without visual overload.

Fully customizable, themeable, and enhanced with interactivity and accessibility in mind, this component helps you deliver helpful answers in a clean and professional manner.

Built for Helpful Content

  1. Expandable Format.
    Show answers only when needed.

  2. SEO-Ready Out of the Box.
    Improve rankings and rich results.

  3. Versatile Layout.
    Support complex answers easily.

Interactive & Customizable

  1. Open by default or manually.
    Make content always visible if needed.

  2. Visual visibility Indicators.
    Guide users with clarity.

  3. Style the trigger and content.
    Match your brand or UI system.

Use Cases

The FAQ Item is ideal for any content where quick-access, structured answers improve clarity and user satisfaction.

Use it for:

  • FAQ sections on product, pricing, or help pages

  • Support portals where answers need to be brief and navigable

  • Legal, shipping, or return info presented clearly

  • Interactive onboarding or quick tips

  • Boosting SEO through rich results in Google

All while remaining easy to manage and enjoyable to use.

Configuration Options & Features

The FAQ Item combines clarity, interaction, and SEO advantage in one powerful component. Create collapsible answers that are user-friendly and search-optimized, without worrying about markup or implementation.

Built for questions. Optimized for answers. Engineered for visibility.

Question

This is the trigger area of the component. It contains your question text and can include:

  • Headlines

  • Icons

  • Images or custom content

It also serves as a clickable toggle to show or hide the answer section.

Answer

The collapsible container that holds the response to the question. This content area supports:

  • Rich text

  • Lists, links, or even embedded media

  • Multi-component layouts

Use it to provide comprehensive and readable answers.

Indicator

A dedicated slot for an icon or image (e.g., chevron, plus/minus) that rotates or animates depending on the open/closed state.

This visual cue helps guide the user's interaction.

Initial Open State

Toggle to determine whether the FAQ item is expanded by default when the page loads.

  • Useful for highlighting top questions

  • Keeps UX intuitive for returning users

Closable

A toggle that allows you to lock the FAQ item in an open state, applicable for sections where the answer should always remain visible.

• True: Can be toggled open/closed

• False: Always open (non-collapsible)

Component Theme

Applies styling to the outer FAQ Item container.

Trigger Theme

Styles the trigger area (question text, spacing, hover behavior, etc.) to match your interface.

Content Theme

Apply styles to the answer container, such as background color, spacing, or typography, to enhance its appearance.