Composites & Sections · 23 Props
Faq
SEO-optimized FAQ section with structured data (JSON-LD schema). Renders question/answer pairs as expandable accordion items.
Props
| Prop | Type | Default | Beschreibung |
|---|---|---|---|
| accordion | any | {} | Pass-through props for Accordion.astro |
| accordionClass | string | "" | |
| accordionWidth | string | — | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "full" |
| class | string | "" | |
| defaultOpenIndex | number | -1 | |
| eyebrow | any | — | |
| headingAlign | string | — | optionale Overrides "left" | "center" |
| headingPosition | string | — | "left" | "right" | "top" |
| id | string | — | |
| items | object[] | — | |
| items[].answer | string | — | Plain text answer. Used when answerHtml is not provided. |
| items[].answerHtml | string | — | Pre-rendered, sanitized HTML answer (e.g. from Markdown source). Takes precedence over `answer`. |
| items[].categorySlug | string | — | Category URL slug — required together with `slug` to build the detail link. |
| items[].hasMore | boolean | — | When true, the accordion shows a "Mehr dazu →" link to the detail page. |
| items[].question * | string | — | |
| items[].slug | string | — | Optional slug — when set, item links to detail page at /faq/<categorySlug>/<slug>. |
| lang | string | — | Override locale for collection lookup (defaults to current site locale via Astro.locals.locale) |
| layoutGap | string | — | "sm" | "md" | "lg" |
| limit | number | 6 | Maximum number of items to render on the page. Default: 6 (long enough to feel substantive, short enough to scan). Set to a higher value to show all loaded entries. |
| pageTag | string | — | Optional: load items from `faqs` content collection by tag. Items prop wins if both set. |
| renderJsonLd | boolean | true | SEO |
| showViewAll | boolean | — | Show "view all" link below the accordion. Defaults to false — opt in per page when the listing page is genuinely useful. |
| spacingX | number | — | Spacing multipliers — forwarded to inner Section |
| spacingY | number | — | |
| subtitle | any | — | |
| title | any | — | |
| variant | string | stack | reine Layoutwahl "stack" | "split-left" | "split-right" |
| viewAllHref | string | — | Override the view-all link href (default: site.faq base URL) |
| viewAllLabel | string | — | Override the view-all link label (default: site.faq.labels.viewAll or "Alle Fragen ansehen →") |
Beispiele
Default
Question/answer pairs with auto-generated JSON-LD schema for SEO.
FAQ
Häufige Fragen
Deine Frage fehlt? Kontaktiere uns.
Typically 4–8 weeks depending on scope and complexity.
We use Storyblok as a headless CMS with a visual editor.
Yes, hosting on Cloudflare Pages is included in all packages.
{
"type": "faq",
"props": {
"items": [
{
"question": "How long does a website project take?",
"answer": "Typically 4–8 weeks depending on scope and complexity."
},
{
"question": "What CMS do you use?",
"answer": "We use Storyblok as a headless CMS with a visual editor."
},
{
"question": "Is hosting included?",
"answer": "Yes, hosting on Cloudflare Pages is included in all packages."
}
]
}
}<Faq items={[{"question":"How long does a website project take?","answer":"Typically 4–8 weeks depending on scope and complexity."},{"question":"What CMS do you use?","answer":"We use Storyblok as a headless CMS with a visual editor."},{"question":"Is hosting included?","answer":"Yes, hosting on Cloudflare Pages is included in all packages."}]} />