Bubble.io에서 내비게이션 패널을 만드는 방법은 무엇인가요?

단계 1: Bubble.io 편집기를 열고 네비게이션 패널을 추가하고자 하는 페이지로 이동합니다.

단계 2: 편집기의 왼쪽 상단 모서리로 이동하여 페이지 네비게이션 메뉴를 엽니다. 재사용 가능한 요소 섹션까지 스크롤합니다.

단계 3: 새로운 재사용 가능한 요소 추가를 클릭합니다. 이를 통해 네비게이션 패널을 디자인할 새로운 빈 재사용 가능한 요소를 생성할 수 있습니다.

단계 4: 재사용 가능한 요소가 생성되면 편집기의 새 탭으로 나타납니다. 이제 이 재사용 가능한 요소에 요소를 추가할 수 있습니다.

단계 5: 왼쪽 툴바에서 그룹 요소를 드래그하여 재사용 가능한 요소에 놓습니다. 이 그룹은 네비게이션 바로 사용됩니다.

단계 6: 그룹 내에 버튼 또는 텍스트 요소를 추가하여 네비게이션 링크로 활용합니다. 그룹 전반에 수평 배치하고 필요에 따라 공간을 주세요.

단계 7: 앱의 디자인과 일치하도록 그룹과 버튼의 스타일을 지정합니다. 앱의 테마에 맞추어 색상, 폰트 및 크기를 설정할 수 있습니다.

단계 8: 각 버튼 또는 텍스트 요소에 대해 우클릭하여 워크플로우를 정의하고 워크플로우 시작/편집을 선택합니다. 이를 통해 사용자가 이 네비게이션 링크를 클릭하면 앱의 다른 페이지 또는 섹션으로 이동하도록 설정할 수 있습니다.

단계 9: 네비게이션 패널에 필요한 추가 워크플로우나 로직을 설정합니다. 예를 들어, 사용자의 로그인 상태에 따라 다른 옵션을 표시하려는 경우가 있을 수 있습니다.

단계 10: 재사용 가능한 요소를 설정한 후에는 이를 페이지에 추가해야 합니다. 메인 페이지의 디자인 탭으로 다시 이동합니다. 왼쪽의 요소 트리에서 재사용 가능한 요소를 드래그하여 페이지의 원하는 위치에 놓습니다.

단계 11: 네비게이션 패널에 데이터를 전달하거나 다른 페이지에서 동적으로 제어하려면 재사용 가능한 요소에 콘텐츠의 유형을 설정하고 데이터 표시 및 사용자 정의 상태 동작을 사용하여 데이터를 전송합니다.

단계 12: 앱을 미리 보고 네비게이션 패널이 예상대로 작동하는지 테스트합니다. 조정은 재사용 가능한 요소로 돌아가서 디자인이나 워크플로우를 수정함으로써 이루어질 수 있습니다.

단계 13: 네비게이션 패널의 기능성과 외관에 만족하면 작업을 저장해야 합니다. 네비게이션 패널이 이제 준비되었으며 이 재사용 가능한 요소를 추가한 모든 페이지에서 일관성을 유지할 것입니다.