WordPress(Elementor)에 읽기 진행률 표시줄을 추가합니다
읽기 진행률 표시 줄은 화면의 상단 또는 하단에 얇은 막대를 추가하고 방문자가 페이지를 아래로 스크롤 할 때 채우는 무료 마스터 애드온 확장입니다. 당신은 Elementor 의 페이지 설정에서 페이지 또는 게시물 당에 그것을 전환 한 다음 위치,높이, 트랙 색상,채우기 색상 및 애니메이션 속도를 설정하면 독자가 얼마나 남았는지 알고 싶어하는 긴 기사,튜토리얼, 문서 및 법률 페이지에 적합합니다.
이 확장 프로그램은 스크롤을 추적합니다. 목표 또는 점수를 선,원 또는 팬 게이지로 표시하려면 다음을 사용하십시오 진행률 표시줄 위젯. 스킬 바 목록은 다음을 사용하세요 진행률 표시줄.
페이지당, 위쪽 또는 아래쪽으로 켜십시오
Elementor에서 페이지나 게시물을 열고 기어 아이콘을 클릭하세요 페이지 설정 (게시물에 대한 게시물 설정)을 확장합니다 읽기 진행률 표시줄 섹션. 켜다 읽기 진행률 표시줄을 활성화합니다 및 설정 위치 상단 또는 하단으로. 막대는 화면 가장자리에 고정되어 있으며 방문자가 페이지 상단에서 하단으로 스크롤할 때 0 에서 100%까지 채워집니다.
- 설정은 페이지당 저장되므로 긴 게시물에서 사용하도록 설정하고 짧은 페이지에서는 제외합니다. 사이트 전체 스위치는 없습니다.
- 스위치가 Elementor의 페이지 설정에 있으므로 Elementor로 빌드된 페이지 및 게시물에서 작동합니다.
- 진행 상황은 기사 텍스트뿐만 아니라 머리글, 댓글, 바닥글을 포함한 전체 페이지 높이를 다룹니다.
- 로그인 한 사용자의 경우 바는 워드 프레스 관리자 바 아래로 이동합니다.
높이, 색상 및 애니메이션 속도
세트 높이 0 에서 100px 까지 (기본적으로 5px). 배경 색상 빈 트랙을 색칠합니다(기본적으로 흰색) 채우기 색상 진행 상황을 색칠합니다 (기본적으로 파란색 #007bff). 애니메이션 속도 기본적으로 0 에서 1000 밀리초, 50 까지 채우기가 스크롤을 얼마나 부드럽게 따라가는지 설정합니다.
- Elementor 키트에서 트랙 및 채우기에 대한 전역 색상을 선택할 수 있습니다.
- 헤더를 덮지 않고 3 ~ 6px 막대가 눈에 띕니다.
- 애니메이션 속도가 낮을수록 더 직접적으로 느껴지고, 애니메이션 속도가 높을수록 더 부드러워지지만 약간 지연됩니다.
Elementor Pro 진행률 추적기 대 읽기 진행률 표시줄
Elementor Pro 에는 더 많은 옵션으로 비슷한 작업을 수행하는 Progress Tracker 위젯이 있습니다. 두 가지를 비교하는 방법은 다음과 같습니다.
| 특징 | Elementor Pro 진행 추적기 | 마스터 애드온 읽기 진행률 표시줄 |
|---|---|---|
| 가격 | Elementor Pro가 필요합니다 | 마스터 애드온으로 무료 |
| 어떻게 추가하는지 | 일반적으로 헤더나 단일 게시물 템플릿에 배치되는 위젯입니다 | 각 페이지의 페이지 설정에 있는 스위치 |
| 모양 | 수평한 원형 | 가로 막대 |
| 트랙 | 전체 페이지, 게시물 콘텐츠 또는 CSS 선택기 | 전체 페이지 |
| 백분율 레이블 | 예, 선택 사항입니다 | 아니요 |
| 배치 | 위젯을 어디에 놓든 방향 옵션이 있습니다 | 화면 상단 또는 하단에 고정 |
하나의 템플릿에서 모든 게시물에 필요한 경우 Elementor Pro 의 진행 상황 추적기를 선택하거나 원형 스타일 또는 기사를 통한 진행 상황만 선택할 수 있습니다. 선택한 페이지에서 간단한 무료 막대를 보려면 읽기 진행 상황 막대를 선택하고 무료와 페어링하십시오 목차 긴 게시물에 위젯.
WordPress에서 읽기 진행률 표시줄을 추가하는 방법
Elementor에서 페이지나 게시물을 편집한 Elementor와 무료 Master Addons 플러그인이 필요합니다.
- 설치 및 활성화 WordPress.org 의 마스터 애드온그리고 읽기 진행률 표시줄이 활성화되어 있는지 확인하세요 마스터 애드온, 확장.
- Elementor로 게시물이나 페이지를 엽니다.
- 톱니바퀴 아이콘을 클릭하여 엽니다 페이지 설정 (게시물에 대한 게시물 설정).
- 확장 읽기 진행률 표시줄 그리고 켜세요 읽기 진행률 표시줄을 활성화합니다.
- 상단 또는 하단을 선택한 다음 높이, 배경색, 채우기 색상 및 애니메이션 속도를 설정합니다.
- 페이지를 업데이트하고 앞쪽 끝에 스크롤하여 막대를 확인하십시오.
읽기 진행률 표시줄에 대해 자주 묻는 질문입니다
Reading Progress Bar 는 무료인가요?
예. WordPress.org 의 Master Addons 플러그인에 무료 확장 프로그램이며 무료 Elementor 와 함께 작동합니다. 휴대폰과 태블릿에서도 표시되며 상단 또는 하단 가장자리에 고정됩니다.
일부 페이지에는 추가하지만 다른 페이지에는 추가할 수 없나요?
네,그리고 그것이 작동하는 유일한 방법입니다. 스위치는 각 페이지 또는 게시물의 Elementor Page Settings 에 있으므로 긴 게시물의 경우 켜고 다른 곳에서는 끄십시오. 모든 게시물에 한 번에 추가 할 수있는 전역 설정은 없습니다.
이렇게 하면 내 웹사이트 속도가 느려지나요?
아니요. 추가 파일이나 이미지 없이 활성화되는 페이지에 작은 인라인 스크립트와 몇 줄의 CSS를 추가합니다.
기사만 측정하는가, 아니면 페이지 전체를 측정하는가?
전체 페이지. 채우기는 페이지 상단에서 맨 아래까지 실행되므로 머리글,댓글 및 바닥글도 중요합니다. Elementor Pro 의 Progress Tracker 는 필요한 경우 게시물 내용만 추적할 수 있습니다.
트렌드 엘리먼트 위젯 및 확장
더 짧은 시간에 정교한 웹사이트를 구축하세요.
![Elementor용 마스터 애드온 게시물/페이지 복제기 확장: 랜딩 페이지를 생성하는 WordPress 페이지 목록의 MA 복제기 행 링크 - [복제된 #128] 초안](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
