Elementor 스킬 바 위젯: 하나의 목록에 여러 진행률 바
마스터 애드온 진행률 표시줄 위젯은 하나의 위젯에 여러 개의 가로 스킬 막대를 쌓습니다. 무료입니다. 각 스킬,서비스 또는 목표에 대한 막대를 추가하고 제목과 1 에서 100 까지의 백분율을 부여하고 원하는 경우 막대 당 색상을 선택합니다. 막대는 보기로 스크롤 할 때 0 에서 채워지며 각 막대 안에 백분율이 표시됩니다. 약 페이지,프로젝트 상태 또는 설문 조사 결과의 스킬에 사용하십시오. 대신 단일 원 또는 게이지를 찾으시나요? 를 사용하십시오 진행률 표시줄 서클과 팬 사전 설정이 있는 위젯. 방문자가 게시물을 스크롤할 때 채워지는 막대의 경우 다음을 사용하십시오 읽기 진행률 표시줄.
Elementor에서 스킬 바를 추가하는 방법
Elementor 와 무료 Master Addons 플러그인이 필요합니다. 이 내용을 확인하십시오 진행률 표시줄 문서.
- 아래에서 진행 막대가 켜져 있는지 확인하세요 마스터 애드온, 위젯.
- Elementor 편집기에서 다음을 검색하세요 진행률 표시줄 그리고 페이지로 드래그하세요.
- 통계 표시줄에서 세 개의 샘플 표시줄을 편집하고 항목 추가를 클릭하여 자세한 내용을 확인하세요.
- 각 막대에 대한 제목과 백분율을 설정하고, 다른 색상을 원하는 경우 막대 색상을 설정하세요.
- 스타일 탭에서 트랙을 설정하고 색상, 막대 높이, 간격 및 반경을 채웁니다.
- 제목과 백분율의 스타일을 지정한 다음 페이지를 미리 보고 위젯으로 스크롤합니다.
필요한 만큼 스킬 바를 추가하세요
바는 에 살고 있습니다 통계 바 내용 탭에서 중계기. 각 막대에 대한 항목 추가 를 클릭한 다음 을 설정합니다 통계 제목 (예를 들어 “웹 디자인”), the 백분율 값 1부터 100까지, 그리고 선택 사항입니다 바 색상 해당 막대의 경우. 항목을 드래그하여 재정렬합니다. 제목 필드는 Elementor 동적 태그를 허용합니다.
- 하나의 위젯에 있는 임의의 수의 바.
- 각 막대에는 고유한 제목, 백분율 및 색상이 있습니다.
- 자체 색상이 없는 막대는 스타일 탭의 활성 막대 색상을 사용합니다.
막대, 제목 및 백분율을 스타일링합니다
X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 통계 바 스타일 섹션은 막대 BG 색상(빈 트랙), 활성 막대 색상(채우기), 막대 사이의 수직 간격(5~128px), 막대 높이(1~96px) 및 정사각형 또는 알약 모양의 막대에 대한 통계 막대 테두리 반경을 설정합니다. 통계 제목 정렬, 색상 및 타이포그래피가 있습니다 통계 백분율 막대 안의 숫자에 대한 색상과 타이포그래피가 있습니다.
- 트랙과 채우기의 색상을 구분합니다.
- 둥근 막대의 경우 px 또는 % 단위의 경계 반경입니다.
- 위젯이 보기로 스크롤되면 애니메이션 채우기가 한 번 재생됩니다; 값이 높을수록 채우는 데 시간이 더 오래 걸립니다.
Elementor 진행률 표시줄과 마스터 애드온 진행률 표시줄
Elementor 에는 하나의 막대를 보여주는 무료 Progress Bar 위젯이 있습니다. 두 가지를 비교하는 방법은 다음과 같습니다.
| 특징 | Elementor 진행률 표시줄 | 마스터 애드온 진행률 표시줄 |
|---|---|---|
| 위젯당 바 | 하나 | 당신이 추가한 만큼 |
| 막대 당 색깔 | 위젯 하나, 컬러 하나 | 예, 중계기 항목당 |
| 바 안쪽에 있는 텍스트 | 예, 사용자 정의 내부 텍스트 | 백분율만 |
| 보기로 스크롤하면 애니메이션이 생성됩니다 | 예 | 예 |
| 동적 태그 | 예 | 제목만 |
| 비용 | 무료 | 무료 |
사용자 정의 내부 텍스트가 있는 한 막대의 경우 Elementor 자신의 위젯으로 충분합니다. 기술 목록의 경우 Progress Bars 위젯 하나가 정렬 상태를 유지합니다. 관련: 진행률 표시줄 원과 게이지의 경우 읽기 진행률 표시줄 스크롤 진행을 위해, 그리고 카운터 업 애니메이션 숫자의 경우.
진행률 표시줄에 대해 자주 묻는 질문입니다
막대가 보기 방향으로 스크롤될 때 애니메이션이 발생합니까?
예. 위젯이 뷰포트에 들어가면 각 막대가 0 에서 값까지 채워집니다. 채우기는 퍼센트 포인트당 약 20 밀리초가 걸리므로 90% 막대는 2 초 미만으로 걸립니다. 속도를 변경하거나 애니메이션을 끄는 설정은 없습니다.
Progress Bars 위젯은 무료인가요?
예. 진행률 표시 줄은 모든 콘텐츠 및 스타일 제어 기능이있는 무료 Master Addons 플러그인의 일부입니다. 이 위젯의 Pro 버전은 없습니다.
진행률 표시줄이 모바일에서 반응합니까?
예. 막대는 열의 전체 너비를 차지하므로 화면과 함께 축소됩니다. 막대 높이 및 세로 간격은 반응형 컨트롤이 아니지만 제목 및 백분율 타이포그래피는 태블릿 및 모바일에서 더 작은 글꼴 크기를 사용할 수 있습니다.
활성 막대 색상에 단색 대신 그라데이션을 사용할 수 있습니까?
아니오 막대기 BG 색깔, 활동적인 막대기 색깔 및 각 막대기 자신의 색깔은 단색만 가지고 갑니다. 당신이 그라데이션 채우기를 필요로 하는 경우에, 문의하기 그리고 우리는 CSS 스니펫을 제안할 수 있습니다.
트렌드 엘리먼트 위젯 및 확장
더 짧은 시간에 정교한 웹사이트를 구축하세요.
![Elementor용 마스터 애드온 게시물/페이지 복제기 확장: 랜딩 페이지를 생성하는 WordPress 페이지 목록의 MA 복제기 행 링크 - [복제된 #128] 초안](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
