서클 카운터 추가.

DXPR Builder 배우기페이지 만들기콘텐츠 추가데이터와 모션

비율이나 점수 같은 핵심 숫자 하나를 보여주는 애니메이션 링을 만들 수 있습니다. 랜딩 페이지나 소개 페이지에서 통계를 강조하는 데 사용하세요.

78%까지 채워진 보라색 진행 호와 차트 아이콘, 갱신율 라벨이 표시된 서클 카운터

서클 카운터 추가

로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 첫 페이지에서 확인하세요.

컬럼에 마우스를 올리고 컨트롤 바에서 +를 클릭하거나, 빈 페이지에서 요소 추가를 클릭합니다. 콘텐츠 탭을 열고 서클 카운터를 클릭합니다. 컬럼 맨 위에 요소가 추가되고 설정 대화상자가 열립니다.
링이 채워지는 정도를 비율 슬라이더로 정하거나 옆의 입력란에 값을 직접 입력합니다. 여기에서는 78을 입력합니다.
호의 색상으로 전경색을 선택합니다.
서클 콘텐츠 섹션을 열고 측정 항목의 텍스트 라벨을 입력합니다.
아래의 아이콘 필드에서 검색 상자에 chart를 입력하고 그리드에서 아이콘을 클릭합니다.
대화상자에서 저장을 클릭합니다. 그런 다음 콘텐츠 영역 상단의 툴바에서 저장을 클릭하여 페이지를 저장합니다.

링이 설정한 비율만큼 채워지고 가운데에 아이콘과 라벨이 표시됩니다. 동영상에서는 보라색 링이 78%까지 채워지고 갱신율이라고 적혀 있습니다. 링은 화면에 스크롤되어 나타날 때 애니메이션으로 채워집니다. 페이지를 저장하고 게시하면 방문자에게 표시됩니다.

요소에 마우스를 올리고 컨트롤 바에서 더보기 > 설정을 엽니다. 옵션:

모든 슬라이더 옆에는 정확한 값을 입력하는 숫자 입력란이 있습니다. 서클 콘텐츠 섹션에서 가운데에 표시되는 내용을 정합니다.

진행률 표시: 직접 입력한 텍스트와 아이콘 대신 비율 숫자를 표시합니다. 기본적으로 꺼져 있습니다.
텍스트: 짧은 라벨. 글꼴 크기와 텍스트 색상으로 스타일을 정합니다.
정보: 텍스트 아래에 표시되는 작은 두 번째 줄.
아이콘: 텍스트 앞에 표시되는 아이콘. 검색 옆의 드롭다운에서 그리드를 하나의 아이콘 세트로 제한합니다. 아이콘 크기와 아이콘 색상으로 스타일을 정합니다.

콘텐츠 탭에 서클 카운터가 없습니다. 사용자 프로필에서 숨겨져 있습니다. 관리자에게 사용자 프로필에서 활성화해 달라고 요청하세요.
다시 로드하면 사라집니다. 페이지가 저장되지 않았습니다. 다시 추가하고 콘텐츠 영역 상단의 툴바에서 저장을 클릭합니다.
링이 흐릿하거나 표시되지 않습니다. 전경색과 배경색이 페이지 색상과 너무 비슷합니다. 요소에 마우스를 올리고 컨트롤 바에서 더보기 > 설정을 연 뒤 대비가 큰 색상을 선택합니다.
링에 애니메이션이 적용되지 않습니다. 애니메이션이 꺼져 있거나, 링이 화면에 스크롤되어 나타날 때까지 기다리는 중입니다. 애니메이션을 켜고 원을 화면에 스크롤하여 표시합니다.
텍스트와 아이콘이 표시되지 않습니다. 진행률 표시가 켜져 있어 링에 비율이 표시됩니다. 서클 콘텐츠에서 진행률 표시를 끕니다.

스타일 탭에서 서클 카운터의 간격과 배경을 변경할 수 있습니다.