워드프레스 콘텐츠 작성시 페이지(Page)와 글(Post)을 구분해서 사용하자


워드프레스를 사용해서 글을 작성할 때 워드프레스 콘텐츠 타입을 크게 본다면 두 가지로 생각할 수 있습니다.
두 가지는 하나는 페이지(Page)이고 하나는 글(Post)입니다.
일반적으로 페이지(Page)는 회사 소개등 정적인인 내용을 구성할 때 사용하고, 동적인 블로그성 내용은 글(Post)로 작성하는 것이 좋습니다.




페이징 기능이란?


페이징 처리 기능은 아래 그림을 보면 바로 이해가 갈 것입니다. 페이징 처리 기능은 구글 화면과 같이 클릭을 해서 다음 페이지로 넘어가는 기능을 이야기합니다. 페이징 처리기능이란 용어는 페이지 네비게이션으로 IT 업계에서는 명명하기도 합니다.




요즈음에는 여러 블로그 시스템에서 페이징 기능을 특정 아이콘이나 이미지를 클릭해서 페이징 기능을 두는 대신에 스크롤을 내리면 동적으로 다음 블로그 내용들이 보여지는 방식으로 서비스를 구현하고 있습니다.


워드프레스 페이징 기능 적용의 묘(妙)


워드프레스의 페이징 기능은 여러가지 상황을 고려해 보아야합니다. 워드프레스의 버전과 어떤 테마를 사용하는지에 따라서 페이징 기능을 적용하는 방법이 다르기 때문입니다.

워드프레스의 태생은 작은 블로그 프로그램에서 시작이 되었습니다. 태생이 블로그이기 때문인지 과거 워드프레스 버전에서는 기본적으로 페이징 처리 기능이 페이지번호가 보이는 방식이 아니라 이전, 이후 정도의 페이지 기능 정도만 제공하고 있었습니다.

그래서 숫자가 보이는 페이징 기능을 구현하기 위해서는 페이징 플러그인으로 유명한 WP-PageNavi 플러그인을 설치해서 사용하는 경우가 많았습니다.
전세계적으로 백만건이상 설치된 WP-PageNavi 플러그인은 지금도 워드프레스에서 페이지 네비게이션 기능을 구현할 때 가장 많이 사용하는 플러그인입니다.




그렇지만 아래 화면과 같이 WP-PageNavi 플러그인을 설치한다고 해서 모든 일이 해결되는 것은 아닙니다.
WP-PageNavi 플러그인을 설치한 뒤에 자신의 워드프레스 테마 소스에서 functions.php 나 index.php 등 php 소스를 뒤져서 next_posts_link() 함수를 찾아서 아래 그림과 같이 변경해 주어야 했습니다.





테마가 변경될 때마다 페이징 소스를 수정해야하는 번거로움


워드프레스 설치시 기본적으로 제공되는 TwentyThiteen, TwentyFourteen 테마가 있습니다.
TwentyThiteen 테마까지는 그래도 아래 화면과 같이 next_posts_link 로 검색해서 찾으면 function.php 화일에 동일한 함수명으로 존재를 하였으나
TwentyFourteen 테마에서는 함수 이름마저 변경되었을 뿐아니라 작동 방식이 변경되었습니다.

[ TwentyThiteen 테마 fuctions 소스 ]





TwentyFourteen 테마에서는 functions.php 안에 페이징 기능의 소스가 있는 것이 아니라 template-tags.php 라는 별도의 파일로 inc 폴더안에 존재하게 됩니다. 



소스코드나 함수명도 변경되었습니다.



페이징 기능은 워드프레스 4.2.2와 TwentyFourteen 테마 조합으로


워드프레스 버전을 4.2.2이상 사용하고 기본 테마인 TwentyFourteen 테마를 사용한다면 WP-PageNavi나 별도의 페이징 플러그인을 설치하거나 PHP 소스코드를 수정하지 않아도 간단하게 설정이 가능합니다.


페이징 처리 실습하기


페이징 기능 실습환경은 워드프레스 버전은 4.2.2이상이고 테마는 TwentyForteen 로 구성하였습니다.
페이징 기능 사용을 위해서 관리자 화면의 왼쪽 사이트바 메뉴에서 설정 > 읽기 메뉴를 클릭합니다.



읽기 메뉴를 클릭하면 읽기 설정 화면이 나타납니다. 전면 페이지 표시 항목은 전면 페이지를 표시할 때 최근 글의 리스트를 보여주거나 정적인 페이지를 선택하는 기능입니다. 일단 테스트를 위해서 최근 글 항목에 체크합니다.

페이지당 보여줄 글의 수 항목은 기본적으로 10으로 세팅되어 있습니다. 한 페이지에서 몇 개의 블로그 글(POST)를 보여줄 것인지 설정하는 것입니다. 여기에 입력하는 숫자에 따라서 해당 숫자만큼의 글(POST)를 보여주고 나머지는 자동으로 페이징 표시가 화면에 디스플레이됩니다.




전면 페이지 표시 항목은 최근 글로 선택한 상태에서 페이지당 보여줄 글의 수 항목을 1로 변경하고 저장버튼을 클릭합니다.



저장버튼을 클릭한 뒤에 슈만의 웹사이트로 접속하면 아래와 같이 페이징 처리 기능이 나타나는 것을 확인할 수 있습니다.





가입형 워드프레스에서는?


현재 기준으로 확인하였을 때에 가입형 워드프레스 서비스인 워드프레스닷컴에서는 TwentyFourteen 테마에서 아래와 같이 동일하게 설정하지만 나타나는 페이징 결과는 다르게 나타납니다.

아래 화면은 설치형 워드프레스와 동일하게 페이지당 보여줄 글의 수를 1로 설정한 상태입니다. 페이지당 보여줄 글의 수를 1로 설정했기 때문에 페이지당 한 개의 블로그만 나타날 것입니다.



아래 화면을 보면 가입형에서는 설치형 워드프레스에서 나타난 것과 같이 페이지 번호는 나타나지 않고 이전글 버튼이 나타나는 것을 알 수 있습니다. 머지않아 가입형 워드프레스인 워드프레스 닷컴의 경우에도 버전업이 된다면 페이징 기능이 구현될 것입니다.






설치형 워드프레스 4.2.2 버전과 기본테마 TwentyThirteen의 조합은?


워드프레스 4.2.2 버전과 TwentyThirteen 테마의 조합으로는 페이징 기능이 다음과 같이 나타납니다.
여기에서는 페이지당 보여줄 글의 수를 2개로 설정하였습니다.



기본테마인 TwentyThirteen 테마 역시 페이징 기능이 페이지 번호로 출력되지 않고 이전 글로만 나타납니다. 이렇게 페이징 기능은 워드프레스 버전과 테마와 관계가 있습니다.





마지막으로 쓰는 비장의 방법은?


요즈음 개발되는 테마는 페이지 기능이 내장되어 있는 것도 있습니다.
그렇지만 자신의 워드프레스 버전과 테마가 지원을 하지 않는다면 플러그인을 설치하거나 소스코드를 수정해야 합니다.
플러그인 설치가 필요하다면 아래 플러그인을 설치해서 사용합니다.

WP-PageNavi과 WP PageNavi Style 플러그인


플러그인을 설치하기 위해서 워드프레스 관리자 화면의 왼쪽 사이드바에서 플러그인 추가하기 메뉴를 클릭합니다.


플러그인 검색화면에서 wp pagenavi를 입력하고 플러그인을 검색합니다. 검색된 플러그인에서 두 개를 설치할 것입니다.
첫번째 플러그인인 WP-PageNavi는 페이징 네비게이션 기능에 대한 플러그인이고, 두번째 WP PageNavi Style은 페이지 네이게이션의 모양 즉, 스타일을 바꾸는 플러그인입니다. 두 개를 모두 지금 설치하기 버튼을 클릭해서 설치해서 사용하면 됩니다.


WP-PageNavi 플러그인은 설정 > 페이지네비 메뉴에서 설정할 수 있습니다. 페이지네비 메뉴를 클릭합니다.




페이지 네비게이션 옵션에서 한 페이지에 보여줄 글(포스트)의 갯수를 정할 수 있습니다. 물론 이곳에서 설정을 저장한다고 WP-PageNavi 플러그인의 페이지 기능이 동작하지는 않습니다. 추가적으로 테마 소스를 수정해야 합니다. 테마 소스 수정은 아래 워드프레스 공식사이트 플러그인 설명 내용을 참고하여 수정바랍니다.





스타일은 WP PageNavi Style 플러그인에서


페이지네비의 스타일을 변경하려면 WP PageNavi Style 플러그인을 활성화해야 합니다.
플러그인을 활성화하면 왼쪽 사이드바에 PageNavi Style 메뉴가 생성됩니다. PageNavi Style을 클릭합니다.



이곳은 페이지 네이게이션의 스타일을 설정하는 화면입니다. 어떻게 사용자에게 보여지도록 하는지 디자인하는 곳이라 생각하면 됩니다.




스타일을 아래와 같이 변경해 보겠습니다. CSS3 PURPLE 항목을 선택했습니다.



아래 화면과 같이 변경된 것을 확인할 수 있습니다.




+ Recent posts