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

breadcrumb-sample-s

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

Breadcrumb NavXT

특징:
[list style="check"]

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

[/list]
사용법:
[list style="check"]

[/list]

[divider top="yes" text="↑"]

1. 세팅하기

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

2. 기본 코드 삽입하기


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

3. 네비게이션 CSS 변경

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

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

4. 네비게이션 스크린샷


[divider top="yes" text="↑"]

마치며

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

그외 관심 포스트

3 Comments

  1. 2

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

Add Comment Register



댓글 남기기

Your email address will not be published. Required fields are marked *

HTML 태그 및 속성을 사용하실 수 있습니다: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>