목차
이 동적 목차 요소로 긴 형식의 콘텐츠를 통해 독자에게 명확한 로드맵을 제공합니다. 페이지의 제목을 자동으로 스캔하고 클릭 가능한 인덱스를 구축하여 방문자가 필요한 섹션으로 매우 쉽게 이동할 수 있습니다. 세련된 목록 아이콘을 선택하고,공간을 절약하기 위해 전체를 접을 수 있게 만들고,간편한 “상단으로 스크롤”버튼을 추가할 수도 있습니다. 모든 부분의 색상,간격 및 타이포그래피를 완벽하게 제어하면 사이트에 맞게 사용자 정의 코딩된 것처럼 보이는 TOC 를 디자인하는 동시에 사용자 경험과 페이지 시간도 향상시킬 수 있습니다.
스마트하고 자동화된 헤딩 컬렉션
요소는 지능적으로 페이지의 제목 구조 (H1, H2, H3 등) 를 감지하고 자동으로 목차를 생성하여 수동으로 링크를 만들고 업데이트하지 못하게합니다.
- 기사, 문서 또는 방문 페이지에 대한 정확한 콘텐츠 목록을 즉시 생성합니다.
- 앵커 링크의 수동 목록을 구축하는 것과 비교하여 상당한 시간을 절약합니다.
- 나중에 제목을 편집하는 경우 TOC가 페이지의 현재 구조와 항상 일치하는지 확인합니다.
대화형 및 공간 절약형 디자인
사용자가 클릭 한 번으로 확장하거나 숨길 수 있도록 목차를 축소할 수 있도록 합니다. 축소 시작하도록 설정하여 페이지 레이아웃을 깨끗하게 유지하고 토글 아이콘의 크기와 색상을 제어할 수 있습니다.
- 사용자가 TOC를 사용하려고 할 때까지 TOC를 숨겨 페이지 미학을 개선합니다.
- 공간이 제한된 모바일 화면에 적합합니다.
- 사용자 참여를 향상시키는 현대적인 인터랙티브 느낌을 제공합니다.
스크롤 도구를 사용한 향상된 탐색
사용자가 아래로 스크롤할 때 나타나는 전용 “위로 스크롤” 버튼이 포함되어 있습니다. 위치,크기, 색상을 사용자 정의하고,세련된 경험을 위해 사용자 지정 가능한 애니메이션 지연으로 부드러운 스크롤을 활성화할 수 있습니다.
- 긴 페이지의 탐색 기능을 크게 향상시켜 사용자가 수동 스크롤에서 벗어날 수 있도록 합니다.
- 부드러운 스크롤 효과로 페이지 점프에 전문적이고 매끄러운 느낌을 더합니다.
- 고정 헤더나 기타 레이아웃 요소를 고려하여 스크롤 오프셋을 미세 조정할 수 있습니다.
목차에 대해 자주 묻는 질문
목차에서 특정 제목을 제외할 수 있나요?
예. 설정에서 태그 유형 (모든 H4 와 마찬가지로) 으로 전역적으로 제목을 제외할 수 있습니다. 단일 특정 제목을 제외하려면 Elementor 에서 해당 특정 제목 요소의 고급 탭에 사용자 지정 CSS 클래스를 추가합니다.
모든 제목 태그 (H1, H2, H3 등) 에서 작동합니까?
예. 요소는 H1 부터 H6 까지 HTML 제목 태그의 표준 계층 구조를 인식하도록 설계되었습니다. 일반적으로 콘텐츠 설정에 포함할 레벨을 선택할 수 있습니다.
목록에서 현재 활성화된 섹션의 스타일을 어떻게 지정합니까?
“활성 제목”과 “활성 테두리”에 대한 전용 색상 컨트롤이 있습니다. 이를 통해 사용자가 현재 페이지에서 보고 있는 섹션에 해당하는 TOC 항목의 모양을 변경할 수 있습니다.
모든 페이지에 "상단으로 스크롤" 버튼이 표시됩니까?
버튼은 이 특정 요소 인스턴스의 일부입니다. 이 목차 위젯을 배치하고 구성하는 페이지에만 나타납니다. 사이트 전체 템플릿에 위젯을 추가하지 않는 한 전역 사이트 전체 버튼이 아닙니다.
목록 스타일에 사용자 정의 아이콘을 사용할 수 있습니까?
스크린샷은 미리 정의된 목록 스타일 옵션 (숫자 및 아이콘과 같은) 을 보여줍니다. 사용 가능한 스타일 중에서 선택하고 색상을 지정할 수 있지만 플러그인이 직접 아이콘 라이브러리 선택기를 제공하지 않는 한 완전히 사용자 정의 아이콘을 만들려면 추가 CSS 가 필요할 것입니다.
트렌드 엘리먼트 위젯 및 확장
더 짧은 시간에 정교한 웹사이트를 구축하세요.
