워드프레스 GeneratePress 테마는 자체 훅(Hook)을 제공하므로 훅을 사용하여 쉽게 원하는 곳에 콘텐츠를 표시할 수 있습니다. 네이버 카페에서 GeneratePress 테마 무료 버전에서 Rank Math SEO 플러그인의 브레드크럼을 추가하는 방법에 대한 질문이 올라와서 기존에 다루었던 내용이지만 별도로 정리해 보았습니다.

브레드크럼을 표시하면 구글 등 검색엔진에 글이 노출될 때 이동 경로(브레드크럼)이 함께 표시되어 SEO에 도움이 될 수 있습니다.

브레드크럼 (이동구글 검색 결과에 푯되는 브레드크럼 경로)이 구글 검색 결과에 표시된다 — 이동 경로(브레드크럼)이 구글 검색 결과에 표시되어 SEO가 개선된다.

GeneratePress 테마: Rank Math SEO 브레드크럼 추가하기

GP 테마는 자체 후크를 제공하므로 잘 활용하면 스크립트나 HTML 코드, PHP 코드, 숏코드, 텍스트 등의 콘텐츠를 쉽게 원하는 곳에 추가할 수 있습니다.

제너레이트프레스 테마의 훅에 대한 자세한 정보는 다음 글을 참고해 보세요.

GeneratePress 테마 후크 사용하기

GeneratePress 유료 버전을 사용하는 경우에는 외모 » Elements에서 새로운 후크(Hook)를 생성한 다음, 콘텐츠 섹션에는 [rank_math_breadcrumb]을 입력하고 Hook에는 generate_before_entry_title(또는 다른 훅)을 선택하면 됩니다.

또한, Execute Shortcodes를 체크해야 숏코드가 실행됩니다.

Display Rules에서 브레드크럼을 표시할 부분을 위치(페이지, 싱글 포스트, 카테고리 페이지 등)를 지정할 수 있습니다.

GeneratePress 테마 무료 버전에서 Rank Math 브레드크럼 추가하기

아래에서는 Rank Math 플러그인의 브레드크럼(탐색 경로, 이동 경로)을 GeneratePress 테마의 무료 버전에 추가하는 방법에 대하여 설명합니다. Yoast SEO 브레드크럼도 동일한 방법으로 추가할 수 있습니다. Yoast SEO 브레드크럼의 경우 여기를 참고하세요.

워드프레스 GeneratePress 테마에 Rank Math 브레드크럼 설정하기

GeneratePress 테마 무료 버전에서 랭크 매쓰 브레드크럼을 추가하려는 경우 다음과 같은 순서로 진행할 수 있습니다.

차일드 테마를 설치합니다.

차일드 테마(자식 테마)가 설치되어 있지 않은 경우 먼저 차일드 테마를 설치하고 활성화합니다.

Rank Math에서 브레드크럼을 활성화합니다.

Rank Math 검색엔진 최적화 » 일반 설정 » Breadcrumbs 탭으로 이동한 다음, Breadcrumbs 기능 활성화(Enable breadcrumbs function) 옵션을 체크하여 활성화하고 브레드크럼 관련 설정을 지정합니다.

FTP에 접속합니다.

FTP에 접속하여 /wp-content/themes/{GeneratePress 차일드 테마 폴더} 디렉터리로 이동합니다. FTP 사용법은 여기를 참고해 보세요. FTP 접속 정보를 모르는 경우 웹호스팅 업체나 서버 관리자에게 문의할 수 있습니다.

함수 파일을 편집합니다.

차일드 테마 폴더로 이동하였다면 functions.php 파일을 선택하여 텍스트 에디터로 엽니다. 그런 다음 아래에 제시되는 코드를 추가하도록 합니다.

테마 함수 파일에 추가하는 코드

차일드 테마의 함수 파일(functions.php)에 다음과 같은 코드를 추가할 수 있습니다.

add_action( 'generate_after_header', function() {
    if ( function_exists('rank_math_the_breadcrumbs') ) {
        echo '<div class="grid-container grid-parent"><p id="breadcrumbs">';
        rank_math_the_breadcrumbs();
        echo '</p></div>';
    }
} );

그러면 generate_after_header 훅을 사용하여 헤더 아래, 포스트/페이지 타이틀 위에 브레드크럼이 표시됩니다. generate_after_header 훅 대신 generate_before_entry_title 훅을 사용할 수도 있습니다. 훅의 정확한 위치는 다음 그림을 참고하시기 바랍니다(아래 이미지를 클릭하면 확대하여 볼 수 있습니다).

변경 사항을 저장하고 업로드하면 다음과 같이 브레드크럼(이동 경로)이 표시됩니다. 브레드크럼이 표시되지 않으면 캐시를 삭제하시기 바랍니다. 클라우드웨이즈의 경우 서버 캐시도 삭제해야 변경 사항이 곧바로 표시될 것입니다.

브레드크럼 스타일은 CSS를 사용하여 조정할 수 있습니다.