Bubble.io에서 온라인 편집기를 어떻게 설정하나요?

Bubble.io에서 온라인 편집기를 설정하는 것은 앱을 사용자가 콘텐츠를 생성하는 데에 편리하게 이용할 수 있도록 사용자화하는 강력한 방법이 될 수 있습니다. 다음은 Bubble.io 앱에 온라인 편집기를 통합하는 단계별 간단한 안내입니다.

1단계:
먼저 Bubble.io 계정에 로그인하고 온라인 편집기를 통합하려는 앱을 엽니다.

2단계:
Bubble 편집기의 주 메뉴에서 “플러그인” 탭으로 이동합니다. 여기에서 앱에 새로운 플러그인을 추가할 수 있습니다.

3단계:
플러그인 마켓에서 온라인 편집기 플러그인을 검색합니다. 텍스트 편집 기능을 제공하는 "Rich Text Editor" 또는 "Quill" 같은 다양한 옵션들이 있습니다.

4단계:
선호하는 온라인 편집기 플러그인을 선택한 다음 "설치" 버튼을 클릭합니다. 이렇게 하면 편집기가 앱에 추가되므로 앱 워크플로에서 사용할 수 있게 됩니다.

5단계:
플러그인을 설치한 후, “디자인” 탭으로 이동하여 페이지에 편집기를 추가할 수 있습니다. 시각적 요소 영역에서 "입력 양식" 섹션 또는 플러그인의 이름 아래에서 새로 설치된 편집기를 찾아야 합니다.

6단계:
온라인 편집기 요소를 표시하고자 하는 페이지에 드래그합니다. 여기에서 UI 디자인에 따라 크기를 조정하고 위치를 지정할 수 있습니다.

7단계:
오른쪽의 요소 검사기에서 편집기의 속성을 사용자화합니다. 기본 텍스트, 포함할 형식 옵션, 자리 표시자 텍스트 등 편집기의 기능에 따라 다양한 설정을 구성할 수 있습니다.

8단계:
편집기를 사용자화한 후, 사용자가 생성한 콘텐츠를 저장하기 위한 워크플로를 설정합니다. “워크플로” 탭으로 이동하여 편집기의 내용이 변경되거나 제출되는 경우에 새 워크플로를 생성하고, 추적하려는 동작에 따라서 다를 수 있습니다.

9단계:
워크플로 내에서 텍스트를 저장하기 위한 동작을 생성합니다. 예를 들어, 사용자들이 블로그 포스트를 생성한다면, 동작은 "새 항목 생성"이 될 수 있고, 이 항목은 "블로그 포스트"이고 그 중 하나는 "내용"이라고 하는 필드가 될 수 있으며, 이는 온라인 편집기의 값에 매핑됩니다.

10단계:
앱을 미리 보아 온라인 편집기 기능을 테스트합니다. “미리보기” 버튼을 클릭하여 새 브라우저 탭에서 앱을 열고 편집기가 예상대로 표시되고 작동하는지 확인합니다.

11단계:
테스트를 기반으로 필요한 조정을 하십시오. Bubble에서 디자인 또는 워크플로 탭으로 돌아가 설정을 조정하거나 문제를 해결해야 할 수도 있습니다.

12단계:
설정에 만족하면 애플리케이션을 저장하십시오. 새 기능이 준비된 앱을 라이브 환경으로 배포할 수 있습니다.

그리고 이것으로 끝입니다! 이제 Bubble.io 앱에는 사용자가 앱 내에서 직접 콘텐츠를 생성하고 편집할 수 있는 통합 온라인 편집기가 있습니다. 온라인 편집기 플러그인과 관련된 구체적인 지침에 대해서는 Bubble의 문서 또는 지원을 확인하십시오.