워드프레스 포스트 네비게이션


2011년 7월 18일


즐겁게 블로그 글을 읽다가 다시 동일한 카테고리로 돌아가고 싶을 때나 블로그 글의 카테고리를 다시 한번 확인하고 싶을 때가 있습니다. 카테고리가 단순하다면 아무런 문제가 없겠지만 복잡한 카테고리에서 우연히 어떤 글을 발견했다면 그 카테고리의 상위나 하위 글을 읽기 위해서 다시 카테고리 여행을 떠나야합니다. 하지만 지금 읽고 있는 글에서 간편하게 현재 글의 카테고리 구조를 보여준다면 복잡한 카테고리 구조에서도 지금 읽는 글의 위치를 파악할 수 있고 다른 관련 카테고리 글들도 쉽게 찾아볼 수 있을 것입니다. 그럼 지금부터 카테고리 구조를 쉽게 파악할 수 있는 방법을 소개하겠습니다.

Breadcrumb NavXT

특징:
  • 현재 글의 위치를 쉽게 파악 가능
  • 다양한 표시 옵션 적용 가능
사용법:

1. 세팅하기

General을 기본으로 세팅하고 필요시 다른 영역에서도 세팅을 변경하세요. 이미지는 클릭하면 크게 보실 수 있습니다.

2. 기본 코드 삽입하기

<div class="breadcrumbs">
<?php
if(function_exists('bcn_display'))
{
    bcn_display();
}
?>
</div>

위의 코드는 포스트 네이게이션을 원하는 영역에서 표시해주는 코드입니다. 위의 코드를 원하는 영역에 삽입하여야 Breadcrumb navXT를 표시할 수 있습니다. 원하는 영역이 포함된 파일(index.php, header.php, content-single.php 등 테마마다 다를 수 있기 때문에 원하는 파일은 사용하시는 테마의 안내를 참고하시기 바랍니다.)을 찾아 여러분이 네비게이션을 표시하고 싶은 영역에 copy&paste하시면 됩니다.

3. 네비게이션 CSS 변경

.breadcrumbs
{
	font-size: 1.1em;
	color: #fff;
	margin: 30px 0 0 10px;
	position: relative;
	float: left;
}

breadcrumbs CSS 스타일링을 통해 포스트 네비게이션에 효과를 줄 수 있습니다. 테마의 style.css에 삽입하시면 됩니다. 위의 코드는 예시입니다.

4. 네비게이션 스크린샷


마치며

지하철과 같이 넓고 복잡한 공간에는 길을 표시하는 표지판이 필수입니다. 하지만 그 표지판이 꼭 넓고 복잡한 공간에만 국한될 필요는 없을 것같습니다. 작은 공간이라도 안내를 위해 표지판을 설치하는 경우가 많이 있습니다. 가장 흔한 예로 화장실 표시가 있겠죠. 또한 요즘은 표지판이 길안내 이외에도 인테리어 효과를 위해 사용되고 있는 것같습니다. 여러분의 블로그에도 표지판을 두어 블로그 사용의 편의성과 더불어 인테리어 효과도 누리시기 바랍니다. :)

  • Pingback: 워드프레스 뜯어먹기 | 블루그리드

  • ahreum

    워드프레스로 회사 홈페이지 작업 중인지라 자주 방문하고 여러 정보 얻고 있습니다. 항상 감사하게 생각하고 있어요! 네비게이션 플러그인도 좀 찾아보고 있었는데, 결국 오늘도 여기서 정보를 얻었네요. 정말 정말 감사합니다.^^

    • http://www.hwangc.com/ HwangC

      댓글 감사합니다.
      필요하신 내용이라니 저도 기분좋네요. :)
      그럼 또 놀러오세요.