코딩 지식 없이 WordPress에서 원형 차트를 만드는 방법

원형 차트를 표시하면 웹 페이지에 다양한 유형의 데이터를 표시하는 데 편리할 수 있습니다. 하지만 코더가 아니거나 CSS에 대한 편집 기술이 충분하다면 어려울 수 있습니다.

그런데 ElementsKit에서는 그렇지 않습니다!

웹사이트에 ElementsKit을 설치하면 드래그 앤 드롭만으로 웹페이지에 원형 차트를 쉽게 추가할 수 있습니다.

이 블로그 게시물에서는 몇 가지 간단한 단계를 통해 WordPress에서 원형 차트를 만드는 방법을 배웁니다.

원형 차트란 무엇입니까?

데이터가 원 안의 여러 섹션으로 그래픽으로 표시되는 경우를 파이 차트라고 합니다. 데이터와 표현 스타일은 다양할 수 있지만 데이터는 그래픽 원 안에 표시됩니다. 때로는 서클의 데이터를 사용자 정의하여 독특한 것을 생각해 낼 수 있습니다.

WordPress에서 원형 차트를 만드는 방법은 무엇입니까?

몇 가지 간단한 단계를 통해 WordPress 대시보드 내에서 바로 원형 차트를 만드세요. 여기에서 공유한 지침을 따르세요.

1단계: 플러그인 설치

여기서 우리의 목표는 코드를 작성하지 않고 WordPress에서 원형 차트를 만드는 것입니다. 그래서 우리는 가장 인기 있는 플러그인을 사용할 것입니다. 엘레멘터 애드온 ElementsKit.

이를 위해 귀하의 WordPress 대시보드 > 플러그인 > 새로 추가. 이제 상단 검색창, Elementor를 검색하세요. 찾으면 설치하고 활성화하십시오.

마찬가지로 ElementsKit을 설치하고 활성화하십시오.

2단계: 플러그인 설정 선택

ElementsKit 플러그인에서 일부 설정을 지정해야 합니다. 이를 위해 WordPress 대시보드로 이동하여 ElementsKit으로 마우스를 가져갑니다. 이제 원형 차트 위젯으로 원형 차트를 만들 것이므로 '위젯'을 선택하십시오.

위젯 목록에서 '파이 차트' 위젯을 켜주세요. 그러나 웹 페이지 구축에 대한 최상의 경험을 얻으려면 모든 위젯을 켜는 것이 좋습니다.

3단계: 새 페이지 만들기

이제 웹 페이지에 차트를 생성할 준비가 모두 완료되었습니다. 사용자 정의 데이터가 포함된 차트를 표시할 페이지를 만듭니다. 또는 기존 페이지 중 하나를 선택할 수 있습니다.

파이 그래프를 표시하기 위해 어떤 페이지를 선택하든 오른쪽 상단에서 'Elementor로 편집'을 선택하세요.

ElementsKit의 모든 기능을 사용할 수 있는 편집기 페이지로 리디렉션됩니다. 

4단계: 원형 차트 위젯 추가

왼쪽 패널에서 원형 차트 위젯을 검색하여 페이지에 끌어다 놓습니다.

원하는 경우 페이지에 위젯을 끌어서 놓기 전에 특정 유형의 섹션을 생성할 수 있습니다.

섹션을 추가하려면 더하기 아이콘을 클릭하고 섹션을 추가하세요.

5단계: 원형 차트 사용자 지정

기본적으로 원형 차트에는 몇 가지 사전 설정이 있습니다. 몇 번의 클릭만으로 이러한 설정을 사용자 정의할 수 있습니다.

콘텐츠 탭에서는 원형 차트 스타일, 차트 콘텐츠 및 차트의 백분율을 변경할 수 있습니다.

원형 차트 스타일: 여기에서 단순 또는 콘텐츠 포함을 선택할 수 있습니다.

차트 내용: 이 섹션에서는 차트에 백분율이나 아이콘을 사용할 수 있습니다. 아이콘을 선택하면 아이콘을 맞춤설정할 수 있는 여러 옵션이 표시됩니다. 차트에 표시하려면 맞춤 아이콘을 업로드하세요.

백분율: 여기서 차트의 백분율을 선택하고 설정할 수 있습니다.

다음으로 스타일 탭으로 이동하여 차트에 스타일을 지정합니다.

원형 차트 크기: 원하는 경우 원형 차트 크기를 조정합니다. 크기를 적어두거나 막대를 드래그하여 크기를 늘리거나 줄일 수 있습니다.

테두리 크기: 여기에서 조정 막대를 사용하여 테두리 크기를 설정합니다.

색상 유형: 원하는 대로 차트의 사용자 정의 색상을 선택합니다.

바 색상: 페이지 디자인에 맞게 막대 색상을 추가합니다.

바 배경색: 원형 차트에 배경색을 추가하면 보기가 더 좋아집니다.

아이콘 색상: 차트 아이콘을 추가한 경우 여기에서 사용자 정의 색상을 선택할 수 있습니다.

더 많은 사용자 정의를 원하는 경우 고급 설정으로 이동하여 필요한 변경을 수행하여 차트를 사용자 친화적으로 만드십시오.

6단계: 페이지 전망 사용자 정의

Elementor를 사용하여 페이지 전망을 사용자 정의할 수도 있습니다. 이를 위해 섹션 상단에 점선 버튼이 있습니다. 그것을 클릭하면 레이아웃 탭으로 리디렉션됩니다.

페이지 레이아웃을 사용자 정의할 수 있는 모든 옵션이 제공됩니다.

7단계: 미리보기 및 게시

마지막으로 모든 작업을 제대로 수행했다면 파이 차트 미리보기를 확인하세요. 완벽해 보인다면 게시 버튼을 누르세요.

읽고 싶은 추가 자료:

디지털 마케팅 대행사 웹사이트를 만드는 방법 [노코드 스타일]

WordPress에서 청소 사업 웹사이트를 만드는 방법

WordPress 웹사이트에 채용 페이지를 만드는 방법

WordPress에서 데이터 시각화를 위한 차트를 만드는 방법

웹사이트에서 원형 차트를 사용해야 하는 이유는 무엇입니까?

원형 차트를 사용하면 웹사이트의 정보를 쉽게 이해할 수 있습니다. 색상과 모양을 사용하여 백분율과 비교를 표시하므로 방문자가 복잡한 데이터를 쉽게 파악할 수 있습니다. 원형 차트를 사용하면 웹 사이트를 더욱 흥미롭게 만들고 사람들이 정보를 더 잘 이해하도록 도울 수 있습니다.

최종 단어

원형 차트를 만드는 것은 어려운 작업이 아닙니다. 단순히 힘을 사용하십시오. ElementsKit의 기존 플러그인과 마찬가지로 단일 유형의 작업을 위한 것이 아닙니다. ElementsKit만 사용하면 전체 웹사이트를 디자인할 수 있습니다. 그러니 그것을 시도하고 귀하의 웹 사이트에 대한 완벽한 모양을 얻으십시오.