WordPress 게시물 또는 페이지에 목차를 추가하는 방법

게시 됨: 2022-09-08

WordPress 게시물 이나 페이지에 목차를 추가하려는 경우 몇 가지 방법이 있습니다. 한 가지 방법은 게시물의 제목을 기반으로 목차를 자동으로 생성하는 Yoast SEO와 같은 플러그인을 사용하는 것입니다. 또 다른 방법은 HTML을 사용하여 수동으로 목차를 만드는 것입니다. 게시물의 여러 섹션 목록을 만든 다음 각 섹션에 앵커 태그를 추가하면 됩니다. 이렇게 하면 독자가 목차의 섹션을 클릭하고 게시물의 해당 섹션으로 직접 이동할 수 있습니다. 마지막으로 WordPress 편집기를 사용하여 게시물에 목차를 삽입할 수도 있습니다. 목차를 표시할 위치에 커서를 놓고 "목차 삽입" 버튼을 클릭하기만 하면 됩니다. 이렇게 하면 게시물에 기본 목차가 삽입되고 원하는 대로 사용자 지정할 수 있습니다.

각 섹션에 목차(TOC)를 포함하여 게시물을 보다 체계적으로 구성하고 독자가 섹션을 더 쉽게 찾을 수 있습니다. 또한 TOC는 사이트의 검색 엔진 최적화(SEO) 효율성을 높일 수 있습니다. 키워드는 매우 중요한 순위 요소이기 때문에 이러한 편리한 링크에 키워드를 쉽게 통합할 수 있습니다. WordPress 사이트 에는 목차(TOC)가 있을 수 있습니다. 목차를 작성하려면 플러그인을 설치해야 합니다. TOC는 단축 코드와 HTML을 사용하여 수동으로 생성할 수도 있습니다. 목차의 스타일은 방문자가 그것을 얼마나 잘 경험하는지에 중요한 영향을 미칩니다.

WordPress는 유동 및 고정의 두 가지 유형의 목차를 제공합니다. 플로팅 TOC 위젯은 사용자가 페이지를 아래로 스크롤할 때 페이지 측면에 남아 있는 위젯입니다. TOC 사이드바와 유사함에도 불구하고 사용자와 함께 스크롤되지 않고 고정된 상태로 유지됩니다.

사이드바에 목차를 표시하려면 모양 > 위젯으로 이동하여 "목차+" 위젯을 사이드바 위젯 영역으로 끌어다 놓습니다. 파일을 저장하기로 결정했으므로 이제 완료되었습니다. TOC가 기준을 충족하는 모든 게시물과 페이지에는 사이드바가 표시됩니다. 어쨌든 기사의 사이드바 위젯은 계속 스크롤됩니다.

WordPress의 사이드바에 목차를 어떻게 추가합니까?

크레딧: qdeinteractive.com

WordPress의 사이드바에 목차를 추가하는 것은 2단계 프로세스입니다. 먼저 사용자 정의 메뉴를 만들어 사이드바에 추가해야 합니다. 둘째, 목차를 표시할 위젯을 사이드바에 추가해야 합니다.

Big Bob의 블로그는 WordPress를 사용하여 사이드바에 목차를 추가하는 방법에 대한 팁을 공유합니다. 플러그인을 사용하여 WordPress에 목차를 추가할 필요가 없습니다. 테이블을 직접 생성하면 플러그인 업데이트의 영향을 받지 않습니다. 테이블에 html과 css를 추가하면 장기적인 호환성을 보장하기에 충분합니다. 사용자 정의 HTML 블록을 만든 후 콘텐츠 섹션에 다음 코드를 삽입합니다. 신청서에 제목을 포함해서는 안 됩니다. 목록 요소의 수를 필요에 따라 설정하고 페이지 제목에 "페이지 콘텐츠" 구성 요소가 포함되어 있는지 확인합니다. 목차의 내용을 입력한 경우에만 목차가 표시됩니다.

WordPress Elementor에서 목차를 추가하는 방법

크레딧: Elementor

WordPress Elementor에 목차를 추가하는 것은 간단한 과정입니다. 먼저 새 WordPress 게시물 또는 페이지를 만듭니다. 그런 다음 목차 요소 를 레이아웃으로 끌어다 놓습니다. 다음으로 표에 표제와 부제목을 추가하십시오. 마지막으로 게시 버튼을 클릭하여 변경 사항을 저장합니다.

Elementor 목차 위젯 을 사용하여 웹사이트에 목차를 추가합니다. 콘텐츠의 제목 태그 계층을 기반으로 위젯은 콘텐츠를 자동으로 생성합니다. 방문자가 링크를 클릭하면 앵커 역할을 하여 페이지의 해당 섹션으로 이동합니다. Elementor Theme Builder의 목차 위젯을 사용하여 목차를 내용에 추가하십시오. 콘텐츠 탭에서 위젯의 콘텐츠를 변경할 수 있습니다. 포함 탭에 목차를 입력한 다음 포함하거나 제외할 콘텐츠를 선택합니다. 게시물의 제외 탭은 CSS 선택기를 선택하여 특정 제목을 제거하는 데 사용할 수 있습니다.

플러그인 없이 WordPress에서 목차를 만드는 방법

플러그인을 사용하지 않고 WordPress에서 목차를 만들 수 있는 몇 가지 다른 방법이 있습니다. 한 가지 방법은 목차에 포함할 주제 목록을 만든 다음 해당 주제를 사이트의 적절한 페이지나 게시물에 하이퍼링크로 연결하는 것입니다. 또 다른 방법은 텍스트 위젯을 사용하고 해당 위젯에 목차를 삽입하는 것입니다. 마지막으로 HTML과 CSS를 사용하여 손으로 목차를 만들 수도 있습니다.

가장 최근의 WordPress 업데이트로 많은 사람들이 Classic Editor에서 Gutenberg Editor로 이동했습니다. 사용자 경험 측면에서 목차는 WordPress에서 좋은 선택입니다. 마찬가지로 웹 사이트에서 목차를 사용하면 사용자가 찾고 있는 콘텐츠 영역으로 이동하는 데 도움이 될 수 있습니다. Google은 SERP에 여러 점프 링크를 표시할 수도 있습니다. 목차의 스타일을 지정하려면 먼저 전체 그룹 블록에 대한 클래스 이름과 목차 및 목록 블록의 제목을 만들어야 합니다. Chris Ferdinandi는 앵커 링크의 스크롤을 부드럽게 하는 경량 스크립팅 언어를 개발했습니다. 고정 헤더를 사용하는 경우 오프셋을 활성화할 수 있지만 접미사가 아닌 헤더를 사용하는 경우 코드에서 오프셋을 제거할 수 있습니다. 플러그인을 사용하여 목차를 만들거나 직접 만들 수 있습니다. 앵커 링크가 있는 목차를 사용하면 바로 이동할 수 있는 Google 검색 엔진 결과의 링크가 표시됩니다. 플러그인을 사용하지 않으려면 목차를 수동으로 포함해야 합니다.

WordPress 블록 편집기에서 목차를 어떻게 삽입합니까?

블록 편집기에서 작업할 때 더하기 기호를 클릭하고 목차를 찾아 페이지나 게시물에 목차를 추가합니다. 블록은 게시물의 제목을 기반으로 테이블을 자동으로 생성하지만 선택할 수 있는 다른 옵션이 많이 있습니다.

목차 플러그인 WordPress

WordPress에 사용할 수 있는 목차 플러그인이 많이 있습니다. 일부는 무료이고 일부는 유료입니다. 목차 플러그인 은 블로그 게시물과 페이지를 구성하는 데 매우 유용합니다. 또한 독자가 사이트를 더 쉽게 탐색하는 데 도움이 될 수 있습니다.

쉬운 목차 모듈을 사용하여 게시물, 페이지 및 사용자 정의 게시물 유형에 목차(TOC)를 추가할 수 있습니다. AMP 사용자는 이제 완전한 지원을 받을 수 있습니다. TOC를 생성하고 기존 설정과 호환되는 AMP로 자동 구성합니다. Easy Table Contents는 Michael Tran의 우수한 Table of Contents Plus 플러그인의 후속 조치입니다. WordPres Visual Post Editor의 형식 드롭다운 메뉴에서 제목 n 옵션 중 하나를 선택하면 이러한 헤더 태그가 나타나고 게시물에 삽입됩니다. 콘텐츠 항목의 테이블은 페이지에 나타나는 각 헤더에 의해 생성됩니다. 중첩된 목차도 만들 수 있으며, 처음 세 항목은 각각 그 아래에 중첩된 하위 항목과 함께 제공됩니다.

무료 소프트웨어인 Easy Table of Contents를 다운로드할 수 있습니다. 이 프로그램은 사용이 간단하며 사용하는 데 많은 지식이 필요하지 않습니다. 목차는 문서에서 찾을 수 있습니다. 마지막 업데이트로 인해 플러그인 저장소에서 제거되었습니다.

쉬운 목차 WordPress

쉬운 목차 WordPress 플러그인을 사용하면 목차를 쉽게 만들고 WordPress 게시물 및 페이지에 삽입할 수 있습니다. 플러그인은 콘텐츠의 제목에서 목차를 자동으로 생성하고 단축 코드를 사용하여 게시물이나 페이지에 삽입할 수 있습니다. 목차의 모양을 사용자 정의하고 콘텐츠를 편집할 때 자동으로 업데이트되도록 설정할 수도 있습니다.

목차(TOC)를 추가하여 독자가 콘텐츠를 더 쉽게 이해하고 액세스할 수 있도록 할 수 있습니다. 목차 Plus는 별점 5점 만점에 4.5점이며 300,000개 이상의 활성 설치가 있습니다. WordPress에는 TOC용 플러그인이 많이 있지만 일부는 다른 것보다 더 비쌉니다. Easy Table of Contents는 새 게시물, 페이지 또는 사용자 정의 게시물을 추가할 때마다 자동으로 목차를 생성합니다. 또한 사용자는 다양한 방법으로 플러그인을 사용자 정의할 수 있습니다. 헤더를 제외하려면 필요에 따라 TOC 를 켜고 끄면 됩니다. 이 게임은 이전 버전 2개만큼 설치가 많지 않지만 별 5개 등급을 받았습니다.

모든 종류의 블록을 만드는 데 사용할 수 있는 단일 블록 플러그인은 없습니다. 사용자는 몇 개의 버튼을 클릭하여 제목에서 직접 목차를 빠르게 생성할 수 있습니다. 이 앱에 대한 한 가지 비판은 구텐베르크 편집기와만 호환된다는 것입니다. 아직 사용 중인 경우 WordPress Classical Editor를 업그레이드해야 할 수 있습니다. Rich Table of Contents는 9,000번의 설치에도 불구하고 별 4.5개를 받았습니다. 무료이며 실시간으로 표시되는 목차를 미리 볼 수 있습니다. 고급 설정이 있는 경우 게시물 및 페이지 ID를 제외하거나 플러그인 CSS를 비활성화할 수 있는 상자를 선택 취소할 수 있습니다.

WordPress 목차 사이드바

WordPress 목차 사이드바 는 콘텐츠를 정리하고 탐색하기 쉽게 유지하는 좋은 방법입니다. 이 사이드바를 사용하면 게시물과 페이지의 목차를 만들어 독자가 원하는 내용을 쉽게 찾을 수 있습니다. 또한 사이드바를 사용하여 독자에게 도움이 될 수 있는 관련 게시물 목록을 만들 수 있습니다.

아래 단계는 WordPress 사이드바에서 목차를 만드는 방법을 안내합니다. 웹 콘텐츠의 길이와 복잡성이 증가함에 따라 목차는 웹에서 모범 사례가 되고 있습니다. 사이트에 머문 시간 및 이탈률과 같은 온페이지 메트릭은 WordPress에서 구현하기 쉬운 하나를 구현하면 향상될 수 있습니다. 대부분의 WordPress 테마는 블로그 게시물 하단에 사이드바를 배치합니다. 모바일 사용자의 경우 페이지 상단의 목차가 더 유용해야 합니다. 이를 수행하려면 사이드바에서 위젯으로 사용할 수 있는 단축 코드가 포함된 플러그인을 사용해야 합니다. 사이트에 LuckyWP 목차 플러그인이 설치되어 있는 경우 단축 코드와 간단한 위젯으로 사이드바에 위젯을 추가하는 것은 간단합니다.

방문자가 목차를 스크롤하도록 하려면 목차를 고정할 수 있습니다. WP Sticky Sidebar 플러그인이 도움이 될 수 있습니다. 2016년 11월 모바일 웹 트래픽은 전체 웹 트래픽의 절반 이상을 차지했습니다. 우리는 모바일의 해를 보지 못했지만, 호랑이가 은밀한 사냥꾼처럼 우리에게 몰래 들어오는 것을 보았습니다. 모바일 트래픽은 목차 하단에 표시될 가능성이 높으므로 보이지 않게 설정하여 숨길 수 있습니다. 대부분의 사람들은 위젯과 단축 코드를 사용하지만 수동으로 또는 코드로 수행하는 것을 선호하는 사람들이 있습니다. 플러그인과 코드, 단축 코드를 사용하여 WordPress 사이트에 목차를 만들려면. 우리 코드는 WebDeasy에서 제공하며 100% 안전합니다.

Toc+ 위젯: 사이드바에 목차를 추가하는 쉬운 방법

"TOC" 위젯은 사이드바 위젯 영역까지 아래로 스크롤하여 거기에 끌어서 놓아 사이드바 위젯 영역으로 끌어다 놓을 수 있습니다.
그런 다음 "저장" 버튼을 클릭하여 변경을 완료합니다. 기준을 준수하기 위해 기준을 충족하는 모든 게시물과 페이지에는 이제 사이드바에 목차가 포함됩니다.

목차 단축 코드 WordPress

목차는 TOC Shortcodes 의 도움으로 완전히 표시됩니다. [toc] 단축 코드는 특정 게시물이나 페이지에 사용하거나 목차 위치를 더 잘 제어하는 ​​데 사용할 수 있습니다.

목차 플러그인을 사용하면 기사에 목차(TOC)를 추가할 수 있습니다. 목차 플러그인 에는 클래스 및 CSS, 패딩, 여백, 배경, 링크 색상 및 글꼴을 사용한 사용자 정의 기능이 포함되어야 합니다. 플러그인 솔루션에 대한 나의 탐구에서 단 하나의 플러그인인 Shortcode 목차만이 내 요구 사항을 충족했습니다. 단축 코드 목차(TOC) 단축 코드를 사용자 정의할 수 있어 좋습니다. 특정 클래스의 모든 제목은 TOC에 사용할 수 있습니다. 아래 스크린샷에서 WordPress 편집기의 텍스트 보기에 "tocview"라는 새 메서드를 추가하여 해당 보기에 새 >div>가 생성되었습니다. div의 닫는 태그는 기사 끝에 나타납니다.

이것이 내가 필요했던 것입니다. 수업 제목을 입력하거나 기본 항목 내용을 사용할 수 있습니다. 목차는 페이지에서 다소 단조롭게 보입니다. 우리는 그것에 신경 쓰지 않습니다. 그것은 우리가 매우 중요하게 여기는 CSS로 그것을 사용자 정의할 수 있게 해줍니다. 보시다시피 다음 CSS를 사용하여 두 번째 스크린샷의 모양을 얻었습니다. 테이블이 shortcode-toc 클래스로 묶인 것을 볼 수 있습니다. 제목의 개별 계층을 만들 수 있습니다.