WordPress 페이지 매김: 수동으로 또는 플러그인을 사용하여 페이지 매김을 추가하는 방법

게시 됨: 2021-12-18

WordPress 페이지 매김을 제어하는 ​​방법을 찾고 계십니까?

사이트의 페이지 매김을 조정하면 보다 사용자 친화적이고 탐색하기 쉬운 웹 사이트를 만들 수 있습니다. 그러나 많은 WordPress 테마는 자세한 페이지 매김 옵션을 제공하지 않으므로 변경할 수 있는 항목이 제한됩니다.

고맙게도 WordPress 페이지 매김을 조정하는 몇 가지 쉬운 방법이 있습니다. 고급 사용자는 사용자 정의 코드에 의존할 수 있는 반면 일반 사용자는 여러 고품질 페이지 매김 플러그인을 찾을 수 있습니다.

이 게시물에서는 WordPress 페이지 매김에 대해 알아야 할 모든 것을 다룰 것입니다.

뛰어들자!

WordPress 페이지 매김이란 무엇입니까?

WordPress 페이지 매김은 웹 사이트의 블로그 게시물 또는 기타 콘텐츠 목록을 별도의 페이지로 분할하는 프로세스입니다.

예를 들어, 100개의 블로그 게시물이 있는 경우 각 페이지에 10개의 블로그 게시물을 표시하도록 페이지 매김 설정을 구성하면 블로그 게시물 목록이 각각 10개의 게시물이 있는 10개의 페이지로 나뉩니다.

그런 다음 방문자는 "다음" 또는 "이전" 버튼을 사용하여 게시물을 나열하는 페이지 사이를 탐색할 수 있습니다. 또는 경우에 따라 방문자는 특정 페이지로 이동할 수 있도록 번호가 매겨진 페이지 목록을 볼 수 있습니다. 예를 들어 페이지 매김은 기본 Twenty Twenty-One 테마에서 다음과 같이 표시됩니다.

기본 Twenty Twenty-One 테마에서 WordPress 페이지 매김의 예.
기본 Twenty Twenty-One 테마의 WordPress 페이지 매김 예제.

하나의 WordPress 게시물을 여러 페이지로 나눌 수도 있습니다. 이는 긴 형식의 콘텐츠를 게시할 때 유용할 수 있습니다.

일부 코드 스니펫이나 플러그인을 사용하면 사이트에서 페이지 매김이 작동하는 방식을 훨씬 더 많이 제어할 수 있습니다. 이 주제는 이 게시물의 뒷부분에서 다룰 것입니다.

WordPress 페이지 매김을 제어하는 ​​방법을 찾고 계십니까? 여기에서 시작 트윗하려면 클릭

왜 WordPress 페이지 매김을 사용합니까?

WordPress 페이지 매김에 관심을 가져야 하는 3가지 주요 이유가 있습니다.

  1. 향상된 탐색 및 사용자 경험
  2. 더 나은 성능
  3. 향상된 SEO 크롤링

그들을 통해 가자.

향상된 탐색 및 사용자 경험

WordPress 페이지 매김 개선의 가장 큰 이점은 방문자가 사이트를 더 쉽게 탐색할 수 있도록 하여 더 나은 경험을 제공한다는 것입니다.

많은 WordPress 테마는 제한된 페이지 매김 옵션만 표시하므로 방문자가 다른 페이지로 이동하기 어렵습니다.

예를 들어 방문자가 게시물의 첫 페이지를 읽을 때 Twenty Twenty-One 테마의 기본 페이지 매김 옵션은 다음과 같습니다.

Twenty Twenty-One 테마는 첫 페이지에 제한된 페이지 매김 옵션을 제공합니다.
Twenty Twenty-One 테마는 첫 페이지에 제한된 페이지 매김 옵션을 제공합니다.

방문자는 마지막 페이지( 이 예에서는 6페이지 ) 또는 다음 페이지( "이전 게시물" 클릭 )로 이동할 수 있지만 3, 4 또는 5페이지로 직접 이동할 수는 없습니다.

방문자가 올바른 위치로 이동할 수 있도록 여러 페이지 매김 링크를 제공하는 Kinsta 블로그와 비교하십시오.

Kinsta 블로그는 방문자가 더 쉽게 탐색할 수 있도록 더 많은 페이지 매김 옵션을 제공합니다.
Kinsta 블로그는 더 쉽게 탐색할 수 있도록 더 많은 페이지 매김 옵션을 제공합니다.

방문자는 더 깊은 페이지로 이동할 때 더 많은 옵션을 얻을 수 있으므로 필요에 따라 다른 페이지로 빠르게 앞으로 또는 뒤로 이동할 수 있습니다.

사용자는 더 깊은 페이지로 이동할 때 더 많은 페이지 매김 옵션을 얻습니다.
사용자는 더 깊은 페이지로 이동할 때 더 많은 페이지 매김 옵션을 얻습니다.

더 나은 성능

페이지 매김을 사용하면 사이트가 각 페이지에 로드해야 하는 데이터의 양을 제한하여 WordPress 사이트의 성능을 향상시키는 전술이 될 수도 있습니다.

예를 들어 블로그 게시물이 50개 있다고 가정해 보겠습니다. 기본 블로그 페이지에 50개의 블로그 게시물을 모두 로드하려고 하면 데이터가 많기 때문에 블로그 페이지가 느리게 로드될 수 있습니다.

그러나 페이지 매김을 사용하여 목록을 각각 10개의 게시물로 구성된 5개의 페이지로 나누면 각 페이지는 데이터의 1/5만 로드하면 되기 때문에 훨씬 더 빨리 로드됩니다.

향상된 SEO 크롤링

페이지 매김을 사용하면 Googlebot과 같은 검색 엔진 로봇이 이러한 봇에 더 많은 탐색 링크를 제공하여 사이트를 더 쉽게 크롤링할 수 있습니다.

약간의 차이가 있지만 사이트의 크롤링 가능성을 개선하기 위해 조정할 수 있는 모든 조정은 항상 SEO에 좋습니다.

WordPress 페이지 매김을 수동으로 제어하는 ​​방법

다음 섹션에서 편리한 WordPress 페이지 매김 플러그인에 대해 살펴보겠지만 WordPress 페이지 매김과 함께 사용할 수 있는 몇 가지 기본 제공 기능도 있습니다. 또는 지식 수준에 따라 사용자 지정 코드를 사용하여 페이지 매김을 조정할 수도 있습니다.

기본 Twenty Twenty-One 테마를 예로 사용하여 페이지 매김 작업을 위한 기본 제공 옵션에 대해 이야기해 보겠습니다.

페이지당 표시할 콘텐츠 항목 수 제어

기본적으로 WordPress는 페이지당 10개의 게시물을 표시합니다. 따라서 게시물이 25개라면 총 3페이지가 됩니다. 처음 2페이지에는 각각 10개의 게시물이 표시되고 마지막 페이지에는 나머지 5개의 게시물이 표시됩니다.

이 숫자를 조정하려면 설정 > 읽기 로 이동하여 블로그 페이지가 최대 값으로 표시되도록 편집할 수 있습니다.

설정 영역에서 WordPress가 페이지당 표시하는 게시물 수를 변경하는 방법.
WordPress가 페이지당 표시하는 게시물 수를 변경하는 방법.

WordPress 게시물 또는 페이지를 여러 페이지로 나누기

지금까지는 주로 블로그 목록 페이지를 여러 페이지로 나누는 데 중점을 두었습니다. 그러나 WordPress를 사용하면 개별 게시물이나 페이지를 다양한 페이지로 나눌 수 있으므로 상황에 따라 도움이 될 수 있습니다.

WordPress 블록 편집기(구텐베르그라고도 함)를 사용하는 경우 페이지 나누기 블록을 사용하여 페이지 나누기를 추가할 위치를 선택할 수 있습니다.

페이지 나누기 블록으로 페이지 나누기를 추가하는 방법.
페이지 나누기 블록으로 페이지 나누기를 추가하는 방법.

클래식 TinyMCE 편집기를 사용하는 경우 다음 두 가지 방법 중 하나를 사용하여 페이지 나누기를 추가할 위치를 선택할 수 있습니다.

  1. 편집기의 시각적 탭에서 페이지 나누기를 추가하려는 위치에 마우스 커서를 놓습니다. 그런 다음 Alt + Shift + P 바로 가기 키를 사용합니다.
  2. 다음 스니펫을 편집기의 텍스트 탭에 붙여넣어 수동으로 페이지 나누기를 배치합니다. <!--nextpage--> .

PHP 및 CSS를 사용하여 WordPress 페이지 매김 동작 조정

기술적인 사람이 아니라면 이 방법이 적합하지 않을 수 있습니다. 페이지 매김 플러그인으로 건너뛰고 싶을 수도 있습니다.

그러나 사이트에 약간의 코드를 수정하는 것이 편하다면 PHP와 CSS를 사용하여 테마의 페이지 매김을 조정할 수 있습니다.

테마의 템플릿 파일을 편집할 것이기 때문에 WordPress 자식 테마를 사용해야 합니다. 그렇지 않으면 다음에 테마를 업데이트할 때 변경 사항을 덮어씁니다. 하위 테마를 설정하는 방법에 대한 자세한 가이드가 있습니다.

또한 변경하기 전에 사이트를 백업하는 것이 좋습니다.

WordPress 테마에 수동으로 페이지 매김을 추가하려면_posts_pagination 기능을 사용할 수 있습니다. 예를 들어 다음 스니펫:

 the_posts_pagination( array( 'mid_size' => 2, 'prev_text' => __( 'Previous Page', 'textdomain' ), 'next_text' => __( 'Next Page', 'textdomain' ), ) );

페이지 매김을 표시할 하위 테마의 템플릿 파일에 이 스니펫을 직접 추가합니다.

아래에서 기본 Twenty Twenty-One 페이지 매김을 그대로 두고 코드 조각을 사용하여 자체 페이지 매김을 추가하여 차이점을 확인했습니다. "Page 1" 페이지 매김은 테마의 기본값이고 "1", "2", "3" 페이지 매김은 사용자 정의 코드에서 가져옵니다.

기본 페이지 매김 및 자체 사용자 지정 페이지 매김의 예입니다.
기본 페이지 매김 및 사용자 지정 페이지 매김의 예입니다.

코드에서 보이는 것은 다음과 같습니다. 원래 페이지 매김 기능과 사용자 지정 페이지 매김을 볼 수 있습니다.

위의 예시 스크린샷에 대한 실제 PHP 코드입니다.
위의 예시 스크린샷에 대한 실제 코드입니다.

라이브 WordPress 사이트에서 기존 페이지 매김 기능을 사용자 정의 기능으로 교체하고 싶습니다(경고: 먼저 스테이징 사이트에서 수행하는 것이 좋습니다. 이것은 단지 예일 뿐입니다!). 테마에 따라 여러 파일을 편집해야 할 수도 있습니다.

FTP 클라이언트를 통해 서버에 연결하고 전용 PHP 편집기를 사용하여 테마 파일을 편집하는 것이 더 편리할 수 있습니다.

테마의 페이지 매김 스타일을 조정하려면 사용자 정의 CSS를 추가해야 합니다.

7가지 최고의 WordPress 페이지 매김 플러그인

사이트의 페이지 매김을 더 많이 제어하려면 WordPress 페이지 매김 플러그인을 사용하는 것이 좋습니다. 다음은 사용 가능한 상위 옵션 중 7개입니다.

1. WP-페이지내비

WP-PageNavi WordPress 플러그인 카드.
WP-PageNavi 워드프레스 플러그인.

700,000개 이상의 사이트에서 활성화된 WP-PageNavi는 가장 인기 있는 WordPress 페이지 매김 플러그인입니다. 또한 100% 무료이므로 인기를 설명하는 데 도움이 됩니다.

사이트의 페이지 매김 동작을 제어할 수 있는 간단한 설정 영역을 제공합니다. 텍스트, 표시할 페이지 번호 등을 조정할 수 있습니다.

페이지 매김 디자인을 더 많이 제어하려면 타사 Styles For WP Pagenavi Addon 플러그인을 고려할 수도 있습니다.

작동 원리

WP-PageNavi는 인기가 높기 때문에 일부 WordPress 테마는 플러그인에 대한 기본 제공 지원을 제공합니다. 테마가 있는 경우 플러그인을 활성화하고 설정을 구성하기만 하면 됩니다. 설정 > PageNavi 로 이동하여 설정에 액세스할 수 있습니다.

WP-PageNavi 설정 영역.
WP-PageNavi 설정 영역.

그러나 테마에 기본 제공 지원이 포함되어 있지 않은 경우 플러그인이 작동하도록 하려면 테마의 템플릿 파일을 수동으로 편집해야 합니다. 이는 기술적인 사람이 아닌 경우 약간 복잡할 수 있습니다.

테마가 페이지 매김에 사용하는 기본 코드를 찾아 WP-PageNavi의 사용자 지정 코드 조각으로 바꿔야 합니다. 개발자는 플러그인의 WordPress.org 페이지에서 이 작업을 수행하는 방법을 설명합니다.

2. WP-페이지 네이트

WP-Paginate WordPress 플러그인 카드.
WP-Paginate WordPress 플러그인.

WP-Paginate는 WordPress 사이트에서 사용자 지정 페이지 매김을 설정하기 위한 또 다른 인기 있는 플러그인입니다. 게시물 페이지 매김을 돕는 것 외에도 플러그인을 사용하여 댓글 섹션에 사용자 정의 페이지 매김을 추가할 수 있습니다. 이는 댓글 속도를 높이는 데 도움이 됩니다.

위의 WP-PageNavi 플러그인과 달리 테마 템플릿 파일을 직접 편집할 필요가 없으므로 기술 담당자가 아닌 경우 더 나은 옵션이 될 수 있습니다. 고급 사용자의 경우에도 PHP를 사용하여 수동으로 테마의 템플릿 파일에 페이지 매김을 배치할 수 있습니다.

플러그인을 사용하면 다음을 포함하여 페이지 매김의 모든 측면을 사용자 지정할 수 있습니다.

  • 레이블 및 버튼
  • 놓기
  • 표시할 탐색 항목 수

대부분의 사이트에서 작동하는 무료 버전이 WordPress.org에 있습니다. 더 많은 사전 설정 스타일과 스타일 옵션을 추가하는 $19 프리미엄 버전도 있습니다.

작동 원리

플러그인을 구성하려면 설정 → WP-Paginate 로 이동하여 플러그인 설정을 제어할 수 있습니다.

테마의 템플릿 파일을 편집하지 않고 플러그인의 페이지 매김을 표시하려면 위치 및 위치 설정에서 다음을 선택하는 것이 좋습니다.

  1. 페이지 매김이 필요한 모든 곳에 새 페이지 매김을 표시하려면 Everywhere 상자를 선택합니다.
  2. 위치 드롭다운을 콘텐츠 아래 로 설정합니다.
  3. 테마의 기존 페이지 매김을 숨기려면 표준 페이지 매김 숨기기 상자를 선택합니다.
WP-Paginate 플러그인 설정 영역.
WP-Paginate 플러그인을 구성하는 방법.

3. BestWebSoft의 페이지 매김

The Pagination by BestWebSoft WordPress 플러그인 카드.
BestWebSoft WordPress 플러그인에 의한 페이지 매김.

BestWebSoft의 페이지 매김은 테마의 템플릿 파일을 편집할 필요 없이 사이트에 새 페이지 매김 시스템을 추가할 수 있는 또 다른 페이지 매김 플러그인입니다.

그러나 위의 WP-Paginate 플러그인과 마찬가지로 배치를 더 많이 제어하려면 테마의 템플릿 파일을 편집할 수 있는 옵션이 있습니다.

플러그인 설정을 통해 페이지 매김의 위치, 스타일 및 동작을 쉽게 조정할 수 있습니다.

무료 버전은 대부분의 사이트에서 잘 작동하지만 20달러 프리미엄 버전은 더 많은 페이지 매김 유형과 기본 제공 Divi 호환성을 추가합니다.

전자 상거래 웹사이트를 위한 놀랍도록 빠르고 안정적이며 완전히 안전한 호스팅이 필요하십니까? Kinsta는 이 모든 것과 WooCommerce 전문가의 연중무휴 세계적 수준의 지원을 제공합니다. 우리의 계획을 확인하십시오

작동 원리

플러그인을 구성하려면 대시보드의 새 페이지 매김 탭으로 이동하십시오.

플러그인의 기본 설정은 자동으로 테마의 기존 페이지 매김을 숨기고 플러그인의 사용자 정의 페이지 매김으로 대체합니다. 새 페이지 매김의 스타일과 동작에 대한 설정을 구성하기만 하면 됩니다.

페이지 매김 플러그인의 설정 영역입니다.
페이지 매김 플러그인의 설정 영역입니다.

4. Ajax 더 로드하기

Ajax Load More WordPress 플러그인 카드.
Ajax 더 많은 WordPress 플러그인 로드.

Ajax Load More를 사용하면 사용자가 새 페이지를 로드하지 않고도 더 많은 콘텐츠를 로드하는 버튼을 만들 수 있습니다. "전통적인" 페이지 매김 및 몇 가지 독특한 비틀기를 포함하여 페이지 매김 제어를 위한 여러 옵션을 제공합니다.

프리미엄 추가 기능을 구매하려는 경우 실제 페이지 매김 버튼을 추가할 수 있습니다. 사용자가 새 페이지로 이동할 때 페이지를 새로고침하는 것으로 인식하지 않지만 URL은 변경됩니다(SEO에 유용). 여기에서 라이브 데모를 볼 수 있습니다.

Ajax Load More를 사용하면 페이지 매김을 무료 버전의 "더 로드" 버튼으로 바꿀 수 있습니다. 방문자가 다른 페이지로 이동하는 데 사용할 수 있는 페이지 매김 링크를 추가하는 대신 Ajax Load More를 사용하면 페이지를 다시 로드하지 않고도 더 많은 게시물을 표시하기 위해 "더 로드" 버튼을 추가할 수 있습니다. 여기에서 라이브 데모를 볼 수 있습니다.

작동 원리

기존 게시물 목록에 페이지 매김을 추가하는 대신 Ajax Load More 플러그인은 원하는 설정이 포함된 새 게시물 목록을 생성하여 작동합니다. 이를 설정하려면 WordPress 대시보드의 Ajax 추가 로드 영역을 사용합니다.

기존의 페이지 매김을 설정하려면 Paging 추가 기능을 구입하여 설치해야 합니다.

5. 알파벳 페이지 매김

알파벳 페이지 매김 WordPress 플러그인 카드.
알파벳 페이지 매김 WordPress 플러그인.

Alphabetic Pagination 플러그인은 사이트에서 AZ 목록과 같은 다른 유형의 페이지 매김을 구현하는 데 도움이 됩니다.

숫자로 페이지를 매기고 게시 날짜별로 게시물을 정렬하는 대신 Alphabetic Pagination을 사용하면 알파벳의 각 문자에 대해 페이지 매김 옵션을 만들 수 있습니다. 그런 다음 사용자가 특정 문자를 클릭하면 해당 문자로 시작하는 모든 콘텐츠가 표시됩니다.

작동 원리

플러그인을 사용하려면 설정 > 알파벳 페이지 매김 으로 이동하여 설정을 구성하십시오.

플러그인 설정의 일반 탭에서 알파벳 페이지 매김을 표시할 위치를 구성할 수 있습니다.

Auto 구현을 사용하는 것이 가장 간단한 옵션입니다. 그러나 단축 코드 탭에서 단축 코드 또는 PHP 기능을 사용하여 알파벳 페이지 매김을 수동으로 배치할 수도 있습니다.

Alphabetic Pagination 플러그인의 설정 영역입니다.
알파벳 페이지 매김의 배치를 구성하는 방법.

배치를 구성한 후에는 스타일 탭에서 알파벳 페이지 매김 디자인을 제어할 수 있습니다.

6. WP 쇼 포스트

WP Show Posts WordPress 플러그인 카드.
WP Show Posts WordPress 플러그인.

WP Show Posts는 사용자 지정 페이지 매김으로 완성된 게시물 목록을 만들 수 있는 유용한 플러그인입니다.

이것이 핵심 세부 사항입니다. 기존 블로그 게시물 목록에 페이지 매김을 추가 하지 않는 것입니다. 대신 자신의 페이지 매김 설정이 포함된 블로그 게시물 목록을 만들고 있습니다.

플러그인에는 표시할 게시물(따라서 페이지를 매길 게시물)을 정확하게 선택할 수 있는 유연한 쿼리 빌더도 포함되어 있습니다.

작동 원리

플러그인을 활성화하면 WP 게시물 표시 > 새로 추가 로 이동하여 새 게시물 목록을 만들 수 있습니다.

표시할 콘텐츠를 제어하려면 모든 설정을 탐색하는 것이 좋습니다. 페이지 매김 설정에서 게시물 탭의 페이지 매김 상자를 선택하고 페이지당 게시물 수를 설정합니다.

페이지 매김으로 새 게시물 목록을 만드는 방법.
페이지 매김으로 새 게시물 목록을 만드는 방법.

모든 것을 설정했으면 단축 코드 또는 PHP 기능을 사용하여 게시물 목록을 추가할 수 있습니다.

7. WooCommerce를 위한 페이지 매김 스타일러

WooCommerce WordPress 플러그인 카드용 페이지 매김 스타일러.
WooCommerce WordPress 플러그인용 페이지 매김 스타일러.

이름에서 알 수 있듯이 WooCommerce용 페이지 매김 스타일러는 특히 WooCommerce 상점을 위한 페이지 매김 플러그인입니다.

상점의 제품 페이지 매김 위치 및 스타일을 제어하기 위한 많은 새로운 옵션을 제공합니다. 기존의 가로 페이지 매김 대신 세로 페이지 매김과 같이 완전히 다른 레이아웃에서 선택할 수도 있습니다.

작동 원리

WooCommerce용 페이지 매김 스타일러는 기존 WooCommerce 페이지 매김을 플러그인의 페이지 매김으로 대체하여 작동합니다.

플러그인 설정을 구성하려면 WordPress 대시보드에서 BeRocket > 페이지 매김 스타일러 로 이동할 수 있습니다.

WooCommerce 플러그인 설정 영역에 대한 페이지 매김 스타일러.
WooCommerce 설정 영역에 대한 페이지 매김 스타일러.

사이트의 페이지 매김을 조정하면 보다 사용자 친화적이고 쉽게 탐색할 수 있는 웹 사이트를 만드는 데 도움이 될 수 있지만 많은 WordPress 테마는 자세한 옵션을 제공하지 않습니다. 이 가이드가 도움이 됩니다! 트윗하려면 클릭

요약

페이지 매김을 사용하면 WordPress 사이트의 콘텐츠를 여러 페이지로 분할할 수 있습니다. 이렇게 하면 사람과 검색 엔진이 더 쉽게 탐색할 수 있으며 각 페이지에 더 적은 데이터를 로드하여 성능을 향상시킬 수도 있습니다.

모든 WordPress 사이트는 기본적으로 페이지 매김 지원과 함께 제공됩니다. 그러나 대부분의 테마에서 기본 페이지 매김 시스템은 제한적입니다.

WordPress 페이지 매김을 개선하려면 사용자 정의 코드를 추가하거나 위에서 설명한 7개의 WordPress 페이지 매김 플러그인 중 하나를 사용할 수 있습니다.

WordPress 페이지 매김에 대해 여전히 질문이 있습니까? 아래 댓글에 여러분의 생각을 공유해주세요!