6. 탭·FAQ·표·폼 등 컴포넌트 활용하기

기본 요소에서 목적에 맞는 컴포넌트를 골라 필요한 정보를 구성합니다. 먼저 작은 예시를 넣고 저장·게시 화면에서 동작을 확인한 뒤 실제 내용으로 바꿔 주세요.

1단계. 정보 전환형 컴포넌트 설정하기

요소	작성 순서	게시 후 확인
탭	항목 이름 입력 → 각 탭의 내용 영역 선택 → 내부 요소 추가 → 처음 열릴 탭 지정	처음 표시되는 탭, 탭별 내용, 순서 변경 후 기본 탭을 확인합니다.
아코디언·FAQ	질문·제목 입력 → 답변 입력 → 항목 추가·삭제 → 펼침 방식 확인	항목을 열고 닫을 수 있고 답변이 잘리지 않는지 봅니다.
스와이퍼·이미지 롤링 배너	슬라이드·이미지 등록 → 순서 정리 → 전환·자동 재생·조작 옵션 설정	이전·다음 이동, 자동 전환, 모바일의 표시 수와 이미지 잘림을 확인합니다.

탭 내용을 넣을 때
탭의 이름만 바꾸는 것과 탭 안에 내용을 추가하는 것은 다릅니다. 원하는 탭을 연 뒤 그 안쪽 추가 위치를 선택합니다. 순서를 바꾼 뒤에는 처음 열릴 탭을 다시 확인하고 저장·게시해 주세요.

주의
폼 모양이 보인다고 문의 접수가 완료된 것은 아닙니다. 접수처와 결과 확인 방법을 준비한 뒤 공개해 주세요. 테스트할 때 실제 고객의 개인정보를 임의로 입력하지 않습니다.

요소	사용 예·확인할 점
목록	특징·준비물 등 반복 정보를 정리합니다. 항목 순서, 목록 표시와 줄바꿈을 확인합니다.
구분선·여백	내용 사이를 구분합니다. 선 색상·굵기·길이와 빈 공간의 높이를 확인합니다.
지도	방문 위치를 안내합니다. 주소·지도 표시와 이동 링크가 실제 장소와 일치하는지 확인합니다.
아이콘·배지	정보를 짧게 강조합니다. 아이콘 의미, 배지 문구, 크기와 색상 대비를 확인합니다.
진행률	진행 상태를 표현합니다. 값·최댓값·표시 단위와 제목을 함께 확인합니다.
카운트다운	이벤트 종료까지 남은 시간을 표시합니다. 종료 날짜·시각과 종료 후 문구를 실제 시각 기준으로 확인합니다.
타임라인	순서·이력·진행 단계를 정리합니다. 날짜와 항목 순서, 모바일 줄바꿈을 확인합니다.
HTML	직접 작성한 HTML을 넣는 고급 기능입니다. 허용되지 않는 코드가 제거될 수 있으므로 입력한 코드가 모두 실행된다고 가정하지 마세요.