사용자가 웹 사이트를 더 잘 탐색할 수 있도록 WordPress에 Breadcrumb를 추가하는 방법

콘텐츠가 풍부한 웹사이트를 운영하고 있거나 이 기사가 WordPress에 이동 경로를 추가하는 방법을 배우는 데 어떻게 도움이 되는지 궁금합니다.

독일 동화 " 헨젤과 그레텔 "에서 남동생과 여동생은 사악한 계모의 계략을 듣고 자신을 보호하기 위해 숲에 버려두고 빵 한 조각을 들고 빵 부스러기 흔적을 남겼습니다. 부모가 그들을 버리면 집으로 돌아갑니다.

현대 출판에서; 웹이나 소프트웨어 또는 문서에서 이동 경로는 독자가 집으로 돌아가는 길을 찾도록 돕는 데 유사하게 사용됩니다. 또는 적어도 그들이 어디에 있는지에 따라 단계를 다시 추적할 수 있습니다.

이동 경로는 방문자의 위치를 ​​보여주는 웹사이트의 2차 탐색 요소입니다.

당신은 그것이 무엇인지 알기 때문에 이 기사를 읽고 있지만 그것이 어떻게 생겼는지 궁금하다면 eBay로 가서 그들의 기사를 볼 수 있습니다.

Galaxy S9+ iPhone X XS Max용 Qi 무선 고속 충전기 충전 패드 스탠드 도크를 보고 있는 구매자는 제품의 위치와 제품이 나열된 다양한 카테고리를 얻는 방법을 쉽게 알 수 있습니다.

이 경우 홈 페이지로 돌아가는 링크가 있고 제품이 나열되는 기본 카테고리( 휴대폰 및 액세서리) 와 하위 카테고리( 휴대폰 액세서리 ) 및 또 다른 하위 카테고리( 충전기 및 크래들) 에 대한 링크가 있습니다.

WordPress 웹 사이트에 이동 경로를 추가하는 이유는 무엇입니까?

위의 eBay 구조를 보면 이동 경로가 계층적 또는 계층적 웹 사이트에서 사용자 경험에 얼마나 탁월한지 알 수 있습니다. 방문자는 사이트를 탐색할 때 특정 시점에 자신이 어디에 있는지 알고 있습니다. 보고 있는 제품이나 기사가 나열된 상위 범주로 이동해야 하는 경우 이동 경로의 링크를 클릭하기만 하면 됩니다.

이는 WordPress 웹 사이트에 이동 경로를 추가하는 또 다른 이점으로 이어집니다. 사용자는 브라우저의 뒤로 버튼을 클릭할 필요 없이 이동 경로만 클릭할 수 있습니다.

이동 경로를 사용하면 웹 사이트에서 콘텐츠를 검색할 수 있습니다. 방문자가 검색 엔진이나 다른 웹사이트의 링크에서 기사로 이동했다고 가정해 보겠습니다. 사용자가 기사를 읽었을 때 이동 경로는 유사한 콘텐츠를 보기 위해 상위 카테고리로 이동할 수 있는 더 많은 옵션을 사용자에게 제공합니다. 이것은 추측할 수 있듯이 사용자가 웹사이트에서 더 많은 시간을 보내도록 하여 이탈률을 감소시킵니다.

이동 경로는 사용자가 웹 사이트를 탐색하는 데 도움이 될 뿐만 아니라 검색 엔진이 사이트를 탐색하는 데에도 도움이 됩니다.

사용자 경험을 개선하는 것, 이탈률을 줄이는 것, 검색 엔진 봇이 사이트를 쉽게 크롤링하고 인덱싱할 수 있는 모든 것이 사이트가 검색 엔진에서 찬사를 받는 데 도움이 됩니다.

그대로, 이동 경로를 추가하면 웹사이트의 검색 엔진 최적화 노력에 도움이 됩니다.

WordPress 웹 사이트에 이동 경로를 추가하는 방법은 무엇입니까?

대부분의 최신 WordPress 테마와 거의 모든 전자 상거래 테마에는 설계상 이동 경로 기능이 있습니다.

이러한 테마로 웹사이트에 이동 경로를 추가하려면 테마 옵션에서 흔히 볼 수 있는 옵션을 활성화하면 됩니다. 의심스러운 경우 테마 문서나 테마 개발자에게 문의하세요.

테마가 기본적으로 이동 경로를 지원하지 않는 경우 이동 경로 플러그인을 사용하여 쉽게 추가할 수 있습니다. Yoast와 같은 대부분의 SEO WordPress 플러그인을 사용하여 사이트에 이동 경로를 추가할 수도 있습니다.

이 기사에서는 무료 WordPress 플러그인인 Breadcrumb NavXT를 사용하여 WordPress에 이동 경로를 추가합니다.

1단계: Breadcrumb NavXT WordPress 플러그인을 설치합니다.

탐색경로 NavXT는 사용자의 위치를 ​​기반으로 탐색경로를 생성합니다. 그런 다음 트레일은 원하는 대로 사용자 지정할 수 있습니다.

계속해서 Breadcrumb NavXT를 설치하십시오.

WordPress에 플러그인을 설치하는 방법을 모른다면 쉽습니다. 대시보드에 로그인한 다음 플러그인 아래의 왼쪽 메뉴에서 아래로 스크롤하고 새로 추가를 클릭합니다.

설치하려는 플러그인( Breadcrumb NavXT )을 검색 상자에 입력합니다.

1-2초 후에 결과가 반환됩니다. 이제 지금 설치 를 클릭하고 1~2초 더 기다린 다음 활성화 를 클릭합니다.

2단계: WordPress 사이트에 탐색경로 NavXT 탐색경로 표시.

두 가지 방법으로 이동 경로를 표시할 수 있습니다.

1. Breadcrumb NavXT에서 제공하는 위젯 사용

메인 메뉴로 이동합니다. 모양 > 위젯.

탐색경로 NavXT를 찾은 다음 탐색경로를 원하는 사이드바로 끕니다.

이제 사이드바가 표시되는 게시물이나 페이지로 이동하면 이동 경로가 표시됩니다.

eBay 예와 같이 사이드바가 아닌 다른 곳에서 이동 경로를 원하면 손을 더럽히고 테마를 수정해야 합니다.

2. 테마 수정

수정해야 할 파일은 다음과 같습니다. home.php, single.php, page.php. 이동 경로가 필요한 경우 분류 및 기타 파일을 수정할 수도 있습니다.

그러나 무엇을 하기 전에 웹사이트를 백업하십시오. 우리 자신의 WPVivid 백업 플러그인은 역효과가 나는 경우 시간과 두통을 줄여줍니다.

다음으로 하위 테마를 변경하는 것이 좋습니다. WordPress 웹 사이트의 하위 테마를 만드는 방법을 정확히 보여주는 기사가 있습니다.

위의 작업을 완료했다면 이동 경로에 표시할 페이지에 다음 코드를 추가하세요.

 <div class="breadcrumbs" typeof="BreadcrumbList" vocab="https://schema.org/">

<?php if(function_exists('bcn_display')) { bcn_display(); }?>

</div>

기사에 표시하려면 single.php 파일을 수정합니다. 기사 태그에 코드를 붙여넣습니다.

변경 사항을 저장한 다음 문서로 이동합니다.

이동 경로는 코드를 배치한 영역에 있어야 합니다.

제 경우에는 기사 상단에 빵 부스러기가 있는 것을 볼 수 있습니다.

이동 경로가 올바르게 표시되지 않으면 일부 CSS로 스타일을 지정해야 합니다.

Breadcrumb NavXT는 .breadcrumbs css 클래스를 사용합니다(테마에 따라 다를 수 있음). 사이트의 CSS 코드를 수정하거나 WordPress 사용자 정의 도구를 사용하여 이동 경로의 스타일을 지정할 수 있습니다.

 .빵 부스러기 {

색상: #000;

여백-하단: 20px;

}

3단계: 탐색 경로 NavXT 탐색 경로 사용자 지정.

이동 경로를 수정해야 하는 경우 WordPress 대시보드에서 수정할 수 있습니다.

탐색경로 NavXT 설정 페이지로 이동합니다. 일반 WordPress – 설정 > Breadcrumb NavXT – 메뉴에서 찾을 수 있습니다.

이제 WordPress 사이트에 이동 경로를 성공적으로 추가했으면 합니다.

웹사이트의 정글에서 방문자를 잃지 마십시오. 웹사이트에 이동 경로를 추가합니다.

다음으로 WordPress에 Google 맞춤 검색을 추가하여 사이트 탐색을 개선하는 방법을 배우고 싶을 수도 있습니다.