CMS: 진행표시 바 추가 및 설정하기
5 분 분량
목표 달성을 향한 진행 상황을 시각적으로 표시할 수 있도록 진행표시 바를 추가하세요. Velo 코딩 또는 CMS 컬렉션 입력란을 사용해 진행률 값을 나타낼 수 있습니다. 목표값으로 변경되지 않는 정적 값을 설정하거나 Velo를 사용하거나 컬렉션 입력란을 연결해 동적 값을 설정할 수 있습니다.
진행표시 바 사용의 예:
- 해야할 업무에 완료로 표시된 작업의 수를 표시합니다.
- 온보딩 과정에서 완료된 단계의 % 비율을 표시합니다.
- 모금 목표 달성을 위해 모금된 금액을 표시합니다.
- 특정 투표 수가 필요한 청원서에 서명한 사용자 수를 표시합니다.
도움말:
CMS에 연결하지 않고도 Velo를 사용해 진행표시 바 값을 업데이트할 수 있습니다. 방법은 진행표시 바 요소 사용하기를 참조하세요. (영문)
진행표시 바를 추가 및 설정하려면:
Wix 에디터
에디터 X
Studio 에디터
- 에디터로 이동합니다.
- 에디터에서 Velo를 활성화합니다.
- 상단에서 개발자 모드를 클릭합니다.
- 개발자 모드 활성화하기를 클릭합니다.
- 에디터 왼쪽에서 요소 추가
를 클릭합니다. - 인터랙티브를 클릭합니다.
- 지표 아래에서 진행표시 바를 클릭합니다.
- 원하는 진행표시 바를 클릭해 페이지로 끌어다 놓습니다.
- 진행표시 바 요소에서 CMS에 연결
아이콘을 클릭합니다. - 데이터세트 선택 드롭다운을 클릭해 컬렉션에 연결할 기존 데이터세트를 선택합니다. 또는, 데이터세트 추가를 클릭한 후 연결할 컬렉션을 선택하고 데이터세트에 이름을 지정한 후 추가를 클릭 합니다.
- 진행값 연결 대상 드롭다운을 클릭한 후 목표 달성을 향한 진행 상황을 나타내는 데 사용할 입력란을 선택합니다.
- 목표값을 항상 동일하게 유지되는 정적 숫자 또는 동적 값으로 설정합니다.
- 정적 목표값 설정: 진행표시 바 요소에서 목표값 설정을 클릭한 후 목표값 입력란에 값을 입력합니다.
- 동적 타겟값 설정: 목표값 연결 대상 드롭다운을 클릭한 후 목표를 나타내는 데 사용할 입력란을 선택합니다.
- 레이아웃
아이콘을 클릭한 후 진행 방향을 선택합니다. - 디자인
아이콘을 클릭해 프리셋 디자인을 선택하거나 기존 디자인을 추가로 사용자 지정합니다. - (선택사항) 애니메이션
아이콘을 클릭해 요소에 애니메이션 효과를 추가합니다.
도움이 되었나요?
|