Thêm Breadcrumbs RankMath vào theme GeneratePress

Thêm Breadcrumbs RankMath vào theme GeneratePress là thao tác (thủ thuật) mà bạn sẽ thực hiện khi làm web, blog với theme GeneratePress vì mặc định (bản miễn phí) không có sẵn (đối với web dùng RankMath).

Nhân tiện Hocban.vn đang sử dụng theme GeneratePress và có kha khá thủ thuật WordPress liên quan đến theme này, nếu bạn quan tâm thì tham khảo thêm ở thẻ GeneratePress nhé !

Cách thêm Breadcrumbs RankMath vào theme GeneratePress

Thiết lập Breadcrumbs RankMath

Bạn mở trang quản trị website WordPress và nhấp vào phần Rank Math SEO như hình bên dưới. Tiếp tục chọn vào Cài đặt chung >> chọn phần Điều hướng trang.

• Bật chức năng điều hướng trang;
• Chọn ký tự phân cách theo ý muốn;
• Chọn ẩn tiêu đề bài viết nếu cần;

Chèn code vào functions.php của  theme/ child theme GeneratePress

Bạn copy đoạn code bên dưới và dán vào dưới cùng file functions.php của  theme/ child theme GeneratePress | Bạn nên dùng child theme để khi cập nhật thì không bị mất những đoạn code đã chèn vào file functions.php nhé !

// Hiển thị Breadcrumb RankMath trên theme GeneratePress

add_action( 'generate_before_content', 'add_rankmath_breadcrumb' );
function add_rankmath_breadcrumb() {
if ( is_single() && function_exists( 'rank_math_the_breadcrumbs' ) ) {
echo '<div class="rankmath-breadcrumb">';
rank_math_the_breadcrumbs();
echo '</div>';
}
}

add_filter( 'rank_math/frontend/breadcrumb/items', 'remove_home_from_archive_breadcrumb' );
function remove_home_from_archive_breadcrumb( $crumbs ) {
if ( is_archive() ) {
unset( $crumbs[0] ); // Loại bỏ "Trang chủ"
}
return $crumbs;
}

Tùy chọn bổ sung cho Breadcrumbs

Bạn thêm CSS bổ sung bên dưới vào để có hình thức tốt hơn hoặc chỉnh sửa thêm nếu bạn biết chỉnh CSS.

.rankmath-breadcrumb {
margin-bottom: 10px;
margin-top: -5%;
border-bottom: solid #f7f8f9 5px;
}