Breadcrumbs là một dạng navigation (tập hợp các liên kết) giúp người dùng định vị được vị trí của trang hiện tại để biết mình đang ở đâu trên website và dễ dàng di chuyển giữa các trang mà không phải quay về trang chủ.
Breadcrumbs cũng rất quan trọng đối với các công cụ tìm kiếm. Google đã khẳng định breadcrumbs giúp công cụ tìm kiếm có được một bức tranh rõ ràng hơn về cấu trúc trang web, giúp các máy tìm kiếm có thể đánh giá website một cách hiệu quả hơn.
Các bạn có thể thấy Google đã lập chỉ mục cho bài viết seo là gì của tôi và hiển thị breadcrumbs trên trang kết quả tìm kiếm giống như hình minh họa.
Hiểu được tầm quan trọng của Breadcrumbs nên rất nhiều nhà phát triển Wordpress đã thiết kế theme có sẵn Breadcrumbs. Để biết Theme bạn đang sử dụng có Breadcrumbs hay chưa thì bạn thử tìm kiếm trên Google một bài viết bất kỳ của website xem Google hiển thị như thế nào? Nếu hiển thị URL kiểu như hình minh họa ở trên thì có nghĩa Theme của bạn có Breadcrumbs rồi. Nếu URL hiển thị đầy đủ (full) cả đường link thì Theme của bạn chưa có Breadcrumbs. Xem ảnh minh họa:
Nếu website của bạn hiển thị như số 1 thì Theme chưa có Breadcrumbs. Để tạo Breadcrumbs cho Wordpress bạn có 2 cách:
1. Sử dụng Plugin
Có nhiều Plugin làm được việc này nhưng nổi tiếng nhất là Breadcrumb NavXT. Bạn chỉ cần cài đặt plugin này và chèn đoạn code dưới đây vào nơi muốn hiển thị Breadcrumbs:
<div class="breadcrumbs" typeof="BreadcrumbList" vocab="http://schema.org/"><?php if(function_exists('bcn_display')) { bcn_display(); }?></div>Hoặc bạn cũng có thể sử dụng tính năng tạo Breadcrumbs được tích hợp sẵn trong plugin seo nổi tiếng Yoast SEO. Sau khi cài plugin xong, bạn vào mục Advanced và tích chọn Enable Breadcrumbs:
Sau đó, chèn đoạn code sau đây vào nơi bạn muốn hiển thị Breadcrumbs:
<?php if ( function_exists('yoast_breadcrumb') ) {yoast_breadcrumb('<p id="breadcrumbs">','</p>');} ?>Việc sử dụng Plugin có ưu điểm là nhanh, dễ cài đặt và sử dụng, tuy nhiên dễ bị lỗi, bị hack hoặc gây chậm web. Cho nên nếu bạn biết về code thì không nên dùng Plugin làm gì.
2. Không sử dụng Plugin
Bước 1: Mở file functions.php (trong thư mục theme bạn đang sử dụng) và chèn vào đoạn code sau:
function schema_breadcrumb() {
global $post;
//schema link
$schema_link = 'http://data-vocabulary.org/Breadcrumb';
$home = 'Home';
$delimiter = ' » ';
$homeLink = get_bloginfo('url');
if (is_home() || is_front_page()) {
// no need for breadcrumbs in homepage
}
else {
echo '<div id="mpbreadcrumbs">';
// main breadcrumbs lead to homepage
if (!is_single()) {
echo 'You are here: ';
}
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . $homeLink . '">' . '<span itemprop="title">' . $home . '</span>' . '</a></span>' . $delimiter . ' ';
// if blog page exists
if (get_page_by_path('blog')) {
if (!is_page('blog')) {
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_permalink(get_page_by_path('blog')) . '">' . '<span itemprop="title">Blog</span></a></span>' . $delimiter . ' ';
}
}
if (is_category()) {
$thisCat = get_category(get_query_var('cat'), false);
if ($thisCat->parent != 0) {
$category_link = get_category_link($thisCat->parent);
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . $category_link . '">' . '<span itemprop="title">' . get_cat_name($thisCat->parent) . '</span>' . '</a></span>' . $delimiter . ' ';
}
$category_id = get_cat_ID(single_cat_title('', false));
$category_link = get_category_link($category_id);
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . $category_link . '">' . '<span itemprop="title">' . single_cat_title('', false) . '</span>' . '</a></span>';
}
elseif (is_single() && !is_attachment()) {
if (get_post_type() != 'post') {
$post_type = get_post_type_object(get_post_type());
$slug = $post_type->rewrite;
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . $homeLink . '/' . $slug['slug'] . '">' . '<span itemprop="title">' . $post_type->labels->singular_name . '</span>' . '</a></span>';
echo ' ' . $delimiter . ' ' . get_the_title();
}
else {
$category = get_the_category();
if ($category) {
foreach ($category as $cat) {
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_category_link($cat->term_id) . '">' . '<span itemprop="title">' . $cat->name . '</span>' . '</a></span>' . $delimiter . ' ';
}
}
echo get_the_title();
}
}
elseif (!is_single() && !is_page() && get_post_type() != 'post' && !is_404()) {
$post_type = get_post_type_object(get_post_type());
echo $post_type->labels->singular_name;
}
elseif (is_attachment()) {
$parent = get_post($post->post_parent);
$cat = get_the_category($parent->ID);
$cat = $cat[0];
echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_permalink($parent) . '">' . '<span itemprop="title">' . $parent->post_title . '</span>' . '</a></span>';
echo ' ' . $delimiter . ' ' . get_the_title();
}
elseif (is_page() && !$post->post_parent) {
$get_post_slug = $post->post_name;
$post_slug = str_replace('-', ' ', $get_post_slug);
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_permalink() . '">' . '<span itemprop="title">' . ucfirst($post_slug) . '</span>' . '</a></span>';
}
elseif (is_page() && $post->post_parent) {
$parent_id = $post->post_parent;
$breadcrumbs = array();
while ($parent_id) {
$page = get_page($parent_id);
$breadcrumbs[] = '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_permalink($page->ID) . '">' . '<span itemprop="title">' . get_the_title($page->ID) . '</span>' . '</a></span>';
$parent_id = $page->post_parent;
}
$breadcrumbs = array_reverse($breadcrumbs);
for ($i = 0; $i < count($breadcrumbs); $i++) {
echo $breadcrumbs[$i];
if ($i != count($breadcrumbs) - 1)
echo ' ' . $delimiter . ' ';
}
echo $delimiter . '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_permalink() . '">' . '<span itemprop="title">' . the_title_attribute('echo=0') . '</span>' . '</a></span>';
}
elseif (is_tag()) {
$tag_id = get_term_by('name', single_cat_title('', false), 'post_tag');
if ($tag_id) {
$tag_link = get_tag_link($tag_id->term_id);
}
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . $tag_link . '">' . '<span itemprop="title">' . single_cat_title('', false) . '</span>' . '</a></span>';
}
elseif (is_author()) {
global $author;
$userdata = get_userdata($author);
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_author_posts_url($userdata->ID) . '">' . '<span itemprop="title">' . $userdata->display_name . '</span>' . '</a></span>';
}
elseif (is_404()) {
echo 'Error 404';
}
elseif (is_search()) {
echo 'Search results for "' . get_search_query() . '"';
}
elseif (is_day()) {
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_year_link(get_the_time('Y')) . '">' . '<span itemprop="title">' . get_the_time('Y') . '</span>' . '</a></span>' . $delimiter . ' ';
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_month_link(get_the_time('Y'), get_the_time('m')) . '">' . '<span itemprop="title">' . get_the_time('F') . '</span>' . '</a></span>' . $delimiter . ' ';
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_day_link(get_the_time('Y'), get_the_time('m'), get_the_time('d')) . '">' . '<span itemprop="title">' . get_the_time('d') . '</span>' . '</a></span>';
}
elseif (is_month()) {
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_year_link(get_the_time('Y')) . '">' . '<span itemprop="title">' . get_the_time('Y') . '</span>' . '</a></span>' . $delimiter . ' ';
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_month_link(get_the_time('Y'), get_the_time('m')) . '">' . '<span itemprop="title">' . get_the_time('F') . '</span>' . '</a></span>';
}
elseif (is_year()) {
echo '<span itemscope itemtype="' . $schema_link . '"><a itemprop="url" href="' . get_year_link(get_the_time('Y')) . '">' . '<span itemprop="title">' . get_the_time('Y') . '</span>' . '</a></span>';
}
if (get_query_var('paged')) {
if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author())
echo ' (';
echo __('Page') . ' ' . get_query_var('paged');
if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author())
echo ')';
}
echo '</div>';
}
}Bước 2: Chèn đoạn code dưới đây vào nơi bạn muốn hiển thị Breadcrumbs:
<?php if(function_exists('schema_breadcrumb')) schema_breadcrumb(); ?>Có thể bạn sẽ thắc mắc tại sao trên mạng thấy nhiều người chia sẻ đoạn code rất ngắn mà code của tôi lại dài như vậy thì xin trả lời bạn rằng code breadcrumbs mà tôi chia sẻ ở đây đã được tối ưu theo cấu trúc chuẩn của Google cho nên rất tốt cho SEO.
