자주 묻는 질문

FAQ

질문마다 가는 선으로 나뉘는 목록. accordion 은 접혀 있고 오른쪽 꺾쇠로 열며, open 은 답이 전부 펼쳐져 있어요.

쓰는 규칙화면에 보이는 질문·답과 검색엔진에 알려 주는 질문·답이 같은 내용이어야 한다.

다른 이름: FaqAccordion

···

usage (Astro)

---
// src/pages/[post].astro
import { Faq } from '../components/registry';
---
<Faq items={post.data.faq} />

site.json

// sites/<사이트>/site.json — 적지 않으면 사이트 이름으로 자동으로 고른다
{
  "variants": { "Faq": "accordion" }
}

props (TypeScript)

export interface FaqProps {
  items: FaqItem[];
  variant?: VariantOf<'Faq'>;
}

accordion 은 「자주 묻는 질문」 제목 아래 질문 네 줄이 굵은 글씨로 나오고 줄 사이는 선, 꺾쇠는 오른쪽 끝에 있어요. open 은 질문이 굵은 제목처럼 나오고 답은 본문과 같은 짙은 글씨로 이어지며 질문 사이를 선으로 나눠요.

글이 길어지는 게 싫으면 accordion, 질문이 검색에 보이길 바라면 open 이 어울려요. 접힌 상태에서는 답이 보이지 않지만 같은 내용이에요.

accordion 은 누르면 바로 열리고 닫히고, 질문 줄에 마우스를 올리면 밑줄이 생겨요.

이럴 때 — 변형 2

accordion펼침 줄 질문이 다섯 개를 넘거나 답이 길 때.쓰는 사이트 4곳: babyplay, babysleep, birthprep, toddlerfood
open모두 펼침 질문이 서너 개로 적고 답이 짧을 때 — Q·A 를 다 펼쳐 둔다.쓰는 사이트 7곳: babyfood, babysick, feeding, milestone, newborn, vaccination, 허브