WordPress Breadcrumb 추가에 대한 기본 가이드

이탈률을 줄이고 웹사이트 탐색을 개선하며 SEO를 향상하고 놀라운 사용자 경험을 제공하고 싶으십니까? 물론 당신은!

그러나 웹사이트의 일부로 이동 경로를 사용하지 않는다면 좋은 기회를 놓치고 있는 것입니다. Breadcrumbs는 사용자가 'breadcrumbs' 흔적을 통해 웹 페이지를 더 쉽게 이동할 수 있도록 도와줌으로써 사이트 탐색을 향상시킵니다.

이동 경로를 여러 번 만났을 가능성이 있습니다. 종종 사이트의 탐색 메뉴 바로 아래에 나타납니다.

출처: dedoles.se

오늘은 WordPress 이동 경로를 사이트에 추가하고 이러한 사용자 경험을 개선하는 데 도움이 되는 최고의 팁과 트릭을 공유할 것입니다.

빵 부스러기 란 무엇입니까?

황금빛과 바삭한, 갓 구운 판코는 잊어버리세요. 그 빵 부스러기가 너무 맛있을 수 있지만 오늘 우리가 여기에서 이야기하려는 것은 아닙니다. 아니요, 우리는 온라인 빵 부스러기 에 대해 논의하기 위해 왔습니다 . 즉, 더 기능적이고 덜 먹을 수 있는 한 조각입니다.

이동 경로는 기본적으로 탐색 링크입니다. 이동 경로는 웹 사이트 페이지를 통해 텍스트 경로를 만들기 위해 연결됩니다. 그들은 홈페이지와 관련하여 웹사이트에서 사용자의 위치를 ​​추적하며 일반적으로 탐색 모음 바로 아래 상단에 있습니다.

이동 경로 는 사용자가 탐색을 더 쉽게 되돌릴 수 있도록 하여 사이트의 사용자 경험 (UX)을 개선합니다. 또한 검색 엔진이 웹 페이지 및 링크 구조를 탐색할 수 있도록 지원하여 SEO 순위를 지원합니다(자세한 내용은 나중에 설명).

다양한 이동 경로의 작동 방식 이해

이동 경로는 다양한 이유로 웹 사이트에 적용될 수 있습니다. 예를 들어 WordPress로 구축된 웹 사이트의 경우 사이트 탐색에 통합할 수 있는 세 가지 유형의 이동 경로가 있습니다. 계층 기반, 속성 기반 및 기록 기반입니다.

계층 기반 이동 경로

이것들은 당신의 고전적인 빵 부스러기입니다. 계층 기반 탐색 경로는 홈페이지와 관련하여 사이트의 전체 구조에서 웹사이트 사용자가 어디에 있는지 보여줍니다. 이를 통해 방문자는 카테고리를 쉽게 탐색하고 관련 제품을 찾을 수 있습니다.

속성 기반 이동 경로

이러한 이동 경로는 전자 상거래 사이트의 일부로 가장 자주 발견됩니다. 속성 기반 이동 경로는 사용자가 보고 있는 제품이나 페이지에 도달하기 위해 검색한 속성을 나열합니다.

예를 들어 온라인 패션 매장을 탐색하고 있다고 상상해 보십시오. 때로는 제품 속성(예: 핏, 스타일, 색상, 크기)과 관련하여 검색을 세분화하라는 요청을 받을 수 있습니다. 선택한 속성이 이동 경로를 구성합니다.

이미지 소스

기록 기반 이동 경로

이 이동 경로는 시간순입니다. 웹 사이트에서 수행하는 작업에 따라 주문됩니다. 히스토리 기반 이동 경로는 사용자가 이미 탐색한 페이지로 다시 안내합니다. 이러한 이동 경로는 브라우저의 '뒤로' 버튼과 같은 역할을 하여 사용자가 이미 방문한 페이지로 돌아갈 수 있도록 도와줍니다.

빵 부스러기의 이점

이동 경로는 웹사이트의 UX 및 SEO에 매우 유용합니다. 따라서 많은 콘텐츠 마케팅 서비스 에서 강력한 디지털 마케팅 전략의 일환으로 이동 경로의 이점을 홍보하고 있습니다.

이동 경로를 사용하면 사용자가 웹 사이트를 보다 쉽게 ​​탐색할 수 있고 검색 엔진 크롤러가 사이트 콘텐츠를 이해하는 데 도움이 됩니다. 즉, 검색 엔진 순위가 향상되고 이탈률이 낮아지고 사용자 경험이 향상됩니다.

방문자를 위한 더 쉬운 사이트 탐색, 즉 이탈률 감소

웹사이트 방문자로서 조금도 관심이 없는 제품 페이지로 이동했다는 사실을 알게 되는 것보다 더 짜증나는 일은 없습니다. 이 시점에서 아마도 두 가지 중 하나를 하고 싶을 것입니다.

• 검색 엔진으로 돌아가서 다시 시작하십시오.
• 홈페이지로 돌아가서 찾고 있던 페이지를 찾으십시오.

사이트에 탐색경로를 추가하면 사용자가 이탈하려는 경향이 줄어들고 원하는 항목을 훨씬 쉽게 찾을 수 있습니다. 탐색경로를 통해 사이트 방문자는 사용자 여정을 쉽게 추적하고 원하는 페이지를 빠르게 찾을 수 있습니다.

사이트 크롤러는 더 쉽게 올바른 페이지의 순위를 매길 수 있습니다.

Breadcrumbs는 사이트 페이지에 대한 정보를 검색 엔진에 전달하여 사이트 SEO를 향상시킵니다. Google은 실제로 검색 스니펫에서 사이트 이름과 이동 경로를 사용합니다. 즉, Google이 결과 목록을 표시할 때 가장 먼저 보게 되는 것 중 하나입니다. 이는 검색자가 클릭 시 어디로 이동하는지 확인하는 데 도움이 됩니다.

예를 들어 '경로란 무엇입니까?'를 검색하면 Google에서 검색 결과에는 각 웹사이트의 URL, 이동 경로 및 제목이 나열됩니다.

WordPress 사이트에 탐색경로를 추가하는 세 가지 방법

그렇다면 WordPress 사이트에 이동 경로를 추가하는 방법은 정확히 무엇입니까? 글쎄, 당신이 취할 수있는 몇 가지 다른 경로가 있습니다. 다양한 방법을 단계별로 안내해 드리겠습니다.

이미 이동 경로가 포함된 WordPress 테마 선택

WordPress 사이트에 이동 경로를 추가하는 가장 간단한 방법은 이미 포함된 테마를 설치하는 것입니다. 브랜딩과 잘 어울리고 편리한 빵 부스러기도 있는 것을 찾을 수 있다면 이제 준비가 된 것입니다.

사용자 지정 코드를 통해 이동 경로 구현

WordPress 사이트에 이동 경로를 추가하는 또 다른 방법은 사용자 정의 코드를 통해 구현하는 것입니다. WordPress에서 테마를 찾았 지만 이동 경로가 포함되어 있지 않다고 가정해 보겠습니다 . 약간의 기본적인 코딩 경험이 있으면 선택한 테마에서 function.php 파일을 편집하여 직접 추가할 수 있습니다.

수행해야 할 작업은 다음과 같습니다.

1. FileZilla FTP와 같은 FTP 사이트를 사용하여 WordPress를 서버에 연결합니다 .
2. FileZilla 클라이언트에서 public_html 폴더를 클릭합니다(여기에는 웹사이트의 파일이 포함됨).
3. wp-content 폴더를 클릭합니다.
4. 테마 디렉토리를 클릭하고 현재 테마 폴더를 선택하십시오.
5. functions.php 폴더를 클릭한 다음 보기/편집을 선택합니다.
6. 사이트에 이동 경로 기능을 등록하려면 아래 코드를 삽입하세요.
7. 메시지가 표시되면 변경 사항을 저장하고 업데이트된 파일을 업로드합니다.

플러그인을 사용하여 이동 경로를 추가하십시오.

WordPress 사이트에 이동 경로를 추가하는 세 번째이자 마지막 방법은 플러그인을 사용하는 것입니다. Yoast SEO, Breadcrumb NavXT 또는 WooCommerce Breadcrumbs 플러그인과 같은 전문 도구를 활용해야 합니다.

Yoast SEO 플러그인 사용

Yoast는 WordPress용으로 가장 잘 알려진 SEO 플러그인 중 하나이며 웹사이트에서 이동 경로를 활성화하는 데 사용할 수 있습니다. 이미 Yoast for SEO를 사용하고 있다면 다른 옵션을 사용할 수 있지만 이것이 최선의 선택입니다(잠시 논의할 예정임).

Yoast를 사용하여 이동 경로를 추가하려면 다음 단계를 따르세요.

1. WordPress 대시보드(예: 플러그인 > 새로 추가 > 검색 창에 'Yoast' 입력 > 설치)에서 Yoast SEO 플러그인을 설치합니다.
2. Yoast 플러그인에서 모양으로 이동합니다.
3. 테마 편집기를 클릭합니다.
4. header.php라는 템플릿을 선택합니다.
5. 아래에 코드 스니펫을 삽입하세요.
6. "파일 업데이트"를 클릭하여 변경 사항을 저장하십시오.

Breadcrumb NavXT 플러그인 사용

Yoast를 사용하는 또 다른 대안은 Breadcrumb NavXT입니다. 이 플러그인은 Yoast처럼 사이트에 설치할 수 있습니다. 설치가 완료되면 아래 단계에 따라 이동 경로를 구현하기만 하면 됩니다.

1. NavXT 플러그인에서 설정으로 이동합니다.
2. 탐색경로 NavXT를 클릭합니다.
3. 네 가지 이동 경로 탐색 옵션에서 선택합니다.
4. 플러그인을 구성하고 변경 사항을 저장합니다.
5. 외모로 이동합니다.
6. 테마 편집기를 클릭합니다.
7. header.php 파일을 선택합니다.
8. 아래 코드를 삽입하십시오.
9. 파일 업데이트를 클릭합니다.

Woocommerce Breadcrumbs 플러그인 사용

마지막으로 Woocommerce 사용자인 경우 Woocommerce Breadcrumbs 플러그인을 사용하여 웹사이트에 탐색경로 기능을 추가할 수 있습니다.

수행해야 할 작업은 다음과 같습니다.

1. WordPress 사이트에 Woocommerce Breadcrumbs 플러그인을 설치합니다.
2. 설정으로 이동합니다.
3. WC 이동 경로를 클릭합니다.
4. 이동 경로를 활성화하려면 옆에 있는 상자를 선택합니다.
5. 변경 사항 저장 을 클릭 합니다.

출처: fixrunner.com

CSS로 WordPress Breadcrumb 사용자 정의

웹사이트의 고유한 스타일에 맞게 사용자 지정 CSS를 적용하여 이동 경로의 스타일을 지정할 수 있습니다. 이동 경로를 직접 코딩하는 경우 목표로 하는 미학에 대해 생각해야 합니다.

이렇게 하려면 사용자 지정 CSS를 추가하여 기존 테마 스타일시트 내에서 또는 WordPress Customizer 내에서 이동 경로의 스타일을 지정해야 합니다. 여기에서 글꼴, 색상, 여백, 아이콘 및 테두리 조정을 포함하여 이동 경로에 대한 디자인 조정을 수행할 수 있습니다.

사이트에서 이동 경로를 제거하는 두 가지 방법

Breadcrumb는 성장을 위한 사이트 탐색 및 SEO 지원과 관련하여 분명한 이점이 있지만 모든 사람이 포함하기를 좋아하는 것은 아닙니다. 사이트의 이동 경로를 제거하기로 결정했다면 두 가지 방법이 있습니다.

비활성화 스위치 전환

이동 경로를 제거하는 첫 번째 방법은 플러그인의 스위치를 토글하여 이동 경로를 비활성화하거나 플러그인을 완전히 비활성화하는 것입니다.

수동으로 입력한 코드 제거

다른 옵션은 수동으로 입력한 코드를 제거하는 것입니다. 사이트의 header.php 폴더로 돌아가서 사이트에 이동 경로를 추가하는 코드 줄을 삭제하기만 하면 됩니다.

빵 부스러기 흔적을 남겨주세요

이동 경로는 모든 웹사이트에 추가할 수 있는 훌륭한 도구입니다. 사용자가 웹 페이지와 검색 엔진 크롤러를 탐색하여 콘텐츠를 더 잘 이해할 수 있도록 도와줍니다.

또한 사이트에 이동 경로를 통합하는 것은 매우 간단합니다. 일부 WordPress 템플릿에는 이동 경로가 포함되어 있습니다.

아직 이동하지 않고 있다면 무엇을 기다리고 계십니까?