Tùy biến breadcrumbs trong Genesis Framework và child theme

Hướng dẫn tùy biến breadcrumbs trong Genesis Framework và child theme.

Breadcrumbs, không còn nghi ngờ gì nữa, là một trong những tính năng hữu ích nhất mà bạn nên có trên blog/ website của mình. Nó không chỉ giúp cải thiện khả năng điều hướng, nâng cao trải nghiệm người dùng mà còn góp phần làm cho kết quả tìm kiếm từ blog/ website của bạn trở nên nổi bật hơn, giúp tăng tỉ lệ click vào kết quả tìm kiếm. Trong Genesis, tính năng này đã được tích hợp sẵn, tuy nhiên vẫn chưa thực sự hoàn hảo lắm.

Tham khảo thêm:

• Top 3 breadcrumbs plugins tốt nhất cho blog WordPress
• 10 Chức năng quan trọng nhất của WordPress SEO by Yoast

Hôm nay, tôi sẽ hướng dẫn có các bạn cách tùy biến breadcrumbs trong Genesis Framework và child theme bằng code snippets một cách đơn giản và nhanh chóng.

Tùy biến breadcrumbs trong Genesis

Sử dụng code snippets

1. Đầu tiên, bạn cần phải kích hoạt chức năng hiển thị breadcrumbs trong Genesis. Từ bảng quản trị WordPress, truy cập Genesis => Theme Settings.

2. Kéo xuống mục Breadcrumbs và tick vào các mục Pages, Posts.

Click vào nút Save Options để lưu lại các thiết lập.

3. Tiếp theo, truy cập Appearance => Editor => Tìm file functions.php của child theme mà bạn đang sử dụng. Thêm vào cuối file functions.php đoạn code sau:

# Tùy biến breadcrumbs trong Genesis
add_filter( 'genesis_breadcrumb_args', 'ebooksvn_breadcrumb_args' );
function ebooksvn_breadcrumb_args( $args ) {
$args['home'] = 'Trang chủ ';
$args['sep'] = ' / ';
$args['list_sep'] = ', ';
$args['prefix'] = '<div class="breadcrumb"><div class="wrap">';
$args['suffix'] = '</div></div>';
$args['labels']['prefix'] = '<span class="home"></span>';
return $args;
}

Trong đó, bạn có thể thay đổi dấu / ở dòng code số 5 sao cho phù hợp với nhu cầu sử dụng.

Kết quả:

• Khi ở trang chủ, bạn sẽ không thấy breadcrumbs:

• Khi ở trang đơn, bài viết, bạn sẽ thấy thanh breadcrumbs như hình bên dưới:

Sử dụng plugin Yoast SEO

Ngoài ra, các bạn cũng có thể sử dụng tính năng Breadcrumbs có trong plugin Yoast SEO để tùy biến breadcrumbs của Genesis Framework và child theme. Tất cả những gì các bạn cần làm là truy cập SEO => Advanced => Breadcrumbs và chỉnh sửa thiết lập theo ý thích.

Đơn giản vậy thôi. Chúc các bạn thành công!

Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)