우리의 단계별 가이드를 탐색하고 WeWeb에서 아코디언 FAQ 섹션을 만드는 방법을 배워보세요. 이 간편한 튜토리얼은 웹사이트 디자인 기술을 향상시키려는 초보자에게 이상적입니다.

Book a call with an Expert
Starting a new venture? Need to upgrade your web or mobile app? RapidDev builds Bubble apps with your growth in mind.
WeWeb에서 시작하기
시작하기 전에 WeWeb에서 가입하고 새 프로젝트를 만들었는지 확인하세요. 홈페이지나 다른 디자인된 페이지에서 아코디언 FAQ 섹션을 추가할 준비가 되었어야 합니다.
그런 다음 아래 단계를 따르세요:
1단계: 요소 라이브러리에 접근하기
WeWeb 대시보드에서 프로젝트를 선택하여 아코디언 FAQ 섹션을 추가하려는 웹사이트 편집기로 이동하세요. 편집 화면으로 이동하면 화면 왼쪽에 요소 라이브러리를 찾을 수 있습니다.
2단계: 아코디언 요소 추가하기
요소 라이브러리에서 '아코디언' 요소를 찾아 보세요. 이 요소를 클릭하고 드래그하여 FAQ 섹션이 위치할 웹페이지의 위치로 옮길 수 있습니다.
3단계: 아코디언 구성하기
아코디언 요소를 클릭하여 속성에 접근하세요. 여기서 '+' 또는 '-' 아이콘을 클릭하여 패널(각각 한 개의 FAQ를 나타냄) 수를 관리할 수 있습니다. 섹션에 대한 FAQ 항목 수만큼 패널을 추가해야 합니다.
4단계: FAQ 정보 입력하기
각 아코디언 패널을 클릭하여 "Summary"와 "Details"의 텍스트 상자에 접근하세요. "Summary"에는 가급적 FAQ 질문이 표시되어야 하며, "Details" 섹션에는 해당 답변이 포함되어야 합니다.
5단계: 텍스트 서식 지정하기
텍스트 서식을 변경하려는 경우 서식을 변경하려는 텍스트를 선택한 다음, 에디터 상단의 옵션을 사용하여 글꼴, 크기, 무게, 색상, 정렬 등을 수정할 수 있습니다.
6단계: 아코디언의 모양과 느낌 조정하기
아코디언이 여전히 선택된 상태에서 외관 설정도 변경할 수 있습니다. 아코디언이 닫힌 상태와 열린 상태에서 어떻게 보이게 될지 스타일을 선택하세요. 배경, 테두리, 텍스트 등에 대한 다른 색상을 선택할 수 있습니다.
7단계: 아코디언 미리보기하기
페이지 상단의 미리보기 버튼을 사용하여 아코디언이 라이브 페이지에서 어떻게 작동하는지 확인할 수 있습니다. 미리보기 모드에서 아코디언 패널의 요약을 클릭하여 확장되고 축소되는 모습을 확인할 수 있습니다. 이는 웹사이트 방문자에게 어떻게 작동할지 시뮬레이션을 제공합니다.
8단계: 변경사항 저장하기
아코디언 FAQ 섹션의 외관과 기능에 만족하는 경우, 변경 사항을 저장해두는 것을 잊지 마세요. WeWeb 에디터의 오른쪽 상단에 저장 옵션을 찾을 수 있습니다.
9단계: 페이지 게시하기
마지막으로 페이지에 대한 모든 변경사항에 만족한다면, 오른쪽 상단에 있는 '게시' 버튼을 클릭하여 변경사항을 실시간으로 반영하세요.
축하드립니다! 이제 WeWeb 웹사이트에 인터랙티브 FAQ 섹션을 추가했습니다.