facebook-icon
Chia sẻ, Tin Tức

Tạo Breadcrumbs cho WordPress không cần Plugin hỗ trợ SEO cực chuẩn

Đã đăng trên bởi admin

Breadcrumbs là một tính năng giúp người dùng dễ dàng điều hướng đến trang mà họ muốn, và nó cũng rất hữu ích cho việc SEO trang web. Có rất nhiều plugin giúp chúng ta tạo breadcrumb cho trang WordPress. Tuy nhiên vì tính chất đơn giản của nó, mà mình khuyên các bạn nên tự tay tạo breadcrumb cho trang web của mình.

Image result for Breadcrumbs cho WordPress

Breadcrumbs là dạng menu chỉ cho người dùng biết họ đang ở đâu trên một trang web. Với những trang web có chiều sâu trong Categories thì Breadcrumbs rất hữu dụng khi người dùng đi sâu vào cấu trúc phức tạp bên trong của trang web. Trong bài viết này, mình sẽ hướng dẫn cách tạo Breadcrumbs cho website của bạn.

Và hiện nay, đa số các theme chuẩn SEO thì đều được tích hợp sẵn chức năng này. Tuy nhiên vẫn có một số theme chưa được tích hợp. Vậy làm sao để có được một thanh Breadcrumb trong trang web? Các bạn hãy làm theo hai bước đơn giản sau đây nhé!

Tính năng chính của Breadcrumbs không cần Plugin

Hiển thị đầy đủ vị trí link hiện tại. Ví vụ như bài viết có 2 cấp bật chuyên mục sẽ như thế này:

  • Trang chủ » Chuyên mục chính » Chuyên mục con » Tiêu đề bài viết

Breadcumb sẽ được hiển thị tại các khu vực sau trong wordpress:

  • paged navigation;
  • category archive;
  • tag archive;
  • daily archive;
  • monthly archive;
  • yearly archive;
  • author archive;
  • custom post type;
  • single post page;
  • single page;
  • attachment page;
  • search results;
  • 404 error page.

 

  • Thêm số trang (nếu archive page đang là 2 hoặc hơn 2)
  • Tùy chỉnh ký tự phân cách
  • Tùy chỉnh chữ cho “Home”
  • Tùy chỉnh style cho breadcumb.
  • Tương thích với microdata của Schema.org.
  • Tạo Breadcrumbs cho WordPress không cần dùng Plugin

Bước 1: Đầu tiên bạn mở file functions.php và copy vào đoạn code sau:

/*
 * WordPress Breadcrumbs
 * author: Dimox - Edit TruongManh.Net
*/
function truongmanh_net_breadcrumbs() {
    /* === OPTIONS === */
    $text['home']     = 'Trang chủ'; // text for the 'Home' link
    $text['category'] = 'Bài của chuyên mục %s'; // text for a category page
    $text['search']   = 'Kết quả tìm kiếm %s'; // text for a search results page
    $text['tag']      = 'Từ khóa %s'; // text for a tag page
    $text['author']   = 'Tất cả bài viết của %s'; // text for an author page
    $text['404']      = 'Lỗi 404'; // text for the 404 page
    $text['page']     = 'Trang %s'; // text 'Page N'
    $text['cpage']    = 'Trang bình luận %s'; // text 'Comment Page N'
    $wrap_before    = '
 
 
<div class="breadcrumbs" itemscope itemtype="http://schema.org/BreadcrumbList">'; // the opening wrapper tag
    $wrap_after     = '</div>
 
 
 
<!-- .breadcrumbs -->'; // the closing wrapper tag
    $sep            = '›'; // separator between crumbs
    $sep_before     = '<span class="sep">'; // tag before separator
    $sep_after      = '</span>'; // tag after separator
    $show_home_link = 1; // 1 - show the 'Home' link, 0 - don't show
    $show_on_home   = 0; // 1 - show breadcrumbs on the homepage, 0 - don't show
    $show_current   = 1; // 1 - show current page title, 0 - don't show
    $before         = '<span class="current truongmanh_breadcrumbs">'; // tag before the current crumb
    $after          = '</span>'; // tag after the current crumb
    /* === END OF OPTIONS === */
    global $post;
    $home_url       = home_url('/');
    $link_before    = '<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">';
    $link_after     = '</span>';
    $link_attr      = ' itemprop="item"';
    $link_in_before = '<span itemprop="name" class="truongmanh_breadcrumbs">';
    $link_in_after  = '</span>';
    $link           = $link_before . '<a href="%1$s"' . $link_attr . '>' . $link_in_before . '%2$s' . $link_in_after . '</a>' . $link_after;
    $frontpage_id   = get_option('page_on_front');
    $parent_id      = ($post) ? $post->post_parent : '';
    $sep            = ' ' . $sep_before . $sep . $sep_after . ' ';
    $home_link      = $link_before . '<a href="' . $home_url . '"' . $link_attr . ' class="home">' . $link_in_before . $text['home'] . $link_in_after . '</a>' . $link_after;
    if (is_home() || is_front_page()) {
        if ($show_on_home) echo $wrap_before . $home_link . $wrap_after;
    } else {
        echo $wrap_before;
        if ($show_home_link) echo $home_link;
        if ( is_category() ) {
            $cat = get_category(get_query_var('cat'), false);
            if ($cat->parent != 0) {
                $cats = get_category_parents($cat->parent, TRUE, $sep);
                $cats = preg_replace("#^(.+)$sep$#", "$1", $cats);
                $cats = preg_replace('#<a([^>]+)>([^<]+)</a>#', $link_before . '<a$1' . $link_attr .'>' . $link_in_before . '$2' . $link_in_after .'</a>' . $link_after, $cats);
                if ($show_home_link) echo $sep;
                echo $cats;
            }
            if ( get_query_var('paged') ) {
                $cat = $cat->cat_ID;
                echo $sep . sprintf($link, get_category_link($cat), get_cat_name($cat)) . $sep . $before . sprintf($text['page'], get_query_var('paged')) . $after;
            } else {
                if ($show_current) echo $sep . $before . sprintf($text['category'], single_cat_title('', false)) . $after;
            }
        } elseif ( is_search() ) {
            if (have_posts()) {
                if ($show_home_link && $show_current) echo $sep;
                if ($show_current) echo $before . sprintf($text['search'], get_search_query()) . $after;
            } else {
                if ($show_home_link) echo $sep;
                echo $before . sprintf($text['search'], get_search_query()) . $after;
            }
        } elseif ( is_day() ) {
            if ($show_home_link) echo $sep;
            echo sprintf($link, get_year_link(get_the_time('Y')), get_the_time('Y')) . $sep;
            echo sprintf($link, get_month_link(get_the_time('Y'), get_the_time('m')), get_the_time('F'));
            if ($show_current) echo $sep . $before . get_the_time('d') . $after;
        } elseif ( is_month() ) {
            if ($show_home_link) echo $sep;
            echo sprintf($link, get_year_link(get_the_time('Y')), get_the_time('Y'));
            if ($show_current) echo $sep . $before . get_the_time('F') . $after;
        } elseif ( is_year() ) {
            if ($show_home_link && $show_current) echo $sep;
            if ($show_current) echo $before . get_the_time('Y') . $after;
        } elseif ( is_single() && !is_attachment() ) {
            if ($show_home_link) echo $sep;
            if ( get_post_type() != 'post' ) {
                $post_type = get_post_type_object(get_post_type());
                $slug = $post_type->rewrite;
                printf($link, $home_url . $slug['slug'] . '/', $post_type->labels->singular_name);
                if ($show_current) echo $sep . $before . get_the_title() . $after;
            } else {
                $cat = get_the_category(); $cat = $cat[0];
                $cats = get_category_parents($cat, TRUE, $sep);
                if (!$show_current || get_query_var('cpage')) $cats = preg_replace("#^(.+)$sep$#", "$1", $cats);
                $cats = preg_replace('#<a([^>]+)>([^<]+)</a>#', $link_before . '<a$1' . $link_attr .'>' . $link_in_before . '$2' . $link_in_after .'</a>' . $link_after, $cats);
                echo $cats;
                if ( get_query_var('cpage') ) {
                    echo $sep . sprintf($link, get_permalink(), get_the_title()) . $sep . $before . sprintf($text['cpage'], get_query_var('cpage')) . $after;
                } else {
                    if ($show_current) echo $before . get_the_title() . $after;
                }
            }
        // custom post type
        } elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) {
            $post_type = get_post_type_object(get_post_type());
            if ( get_query_var('paged') ) {
                echo $sep . sprintf($link, get_post_type_archive_link($post_type->name), $post_type->label) . $sep . $before . sprintf($text['page'], get_query_var('paged')) . $after;
            } else {
                if ($show_current) echo $sep . $before . $post_type->label . $after;
            }
        } elseif ( is_attachment() ) {
            if ($show_home_link) echo $sep;
            $parent = get_post($parent_id);
            $cat = get_the_category($parent->ID); $cat = $cat[0];
            if ($cat) {
                $cats = get_category_parents($cat, TRUE, $sep);
                $cats = preg_replace('#<a([^>]+)>([^<]+)</a>#', $link_before . '<a$1' . $link_attr .'>' . $link_in_before . '$2' . $link_in_after .'</a>' . $link_after, $cats);
                echo $cats;
            }
            printf($link, get_permalink($parent), $parent->post_title);
            if ($show_current) echo $sep . $before . get_the_title() . $after;
        } elseif ( is_page() && !$parent_id ) {
            if ($show_current) echo $sep . $before . get_the_title() . $after;
        } elseif ( is_page() && $parent_id ) {
            if ($show_home_link) echo $sep;
            if ($parent_id != $frontpage_id) {
                $breadcrumbs = array();
                while ($parent_id) {
                    $page = get_page($parent_id);
                    if ($parent_id != $frontpage_id) {
                        $breadcrumbs[] = sprintf($link, get_permalink($page->ID), get_the_title($page->ID));
                    }
                    $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 $sep; } } if ($show_current) echo $sep . $before . get_the_title() . $after; } elseif ( is_tag() ) { if ( get_query_var('paged') ) { $tag_id = get_queried_object_id(); $tag = get_tag($tag_id); echo $sep . sprintf($link, get_tag_link($tag_id), $tag->name) . $sep . $before . sprintf($text['page'], get_query_var('paged')) . $after;
            } else {
                if ($show_current) echo $sep . $before . sprintf($text['tag'], single_tag_title('', false)) . $after;
            }
        } elseif ( is_author() ) {
            global $author;
            $author = get_userdata($author);
            if ( get_query_var('paged') ) {
                if ($show_home_link) echo $sep;
                echo sprintf($link, get_author_posts_url($author->ID), $author->display_name) . $sep . $before . sprintf($text['page'], get_query_var('paged')) . $after;
            } else {
                if ($show_home_link && $show_current) echo $sep;
                if ($show_current) echo $before . sprintf($text['author'], $author->display_name) . $after;
            }
        } elseif ( is_404() ) {
            if ($show_home_link && $show_current) echo $sep;
            if ($show_current) echo $before . $text['404'] . $after;
        } elseif ( has_post_format() && !is_singular() ) {
            if ($show_home_link) echo $sep;
            echo get_post_format_string( get_post_format() );
        }
        echo $wrap_after;
    }
} // end of truongmanh_net_breadcrumbs()

 

Bước 2: Sau đó, để hiển thị breadcrumbs trên wordpress của bạn, bạn mở file single.php lên và chèn hàm này vào chỗ nào phù hợp bạn muốn:

<?php if (function_exists('truongmanh_net_breadcrumbs')) truongmanh_net_breadcrumbs(); ?>

 

1
<?php if (function_exists('truongmanh_net_breadcrumbs')) truongmanh_net_breadcrumbs(); ?>

Sau khi thêm kết quả web của bạn sẽ như sau:

 

P/S: Trong quá trình vọc và làm web, mình hay dùng Flatsome nhưng đặc biệt Flatsome chỉ hỗ trỡ Breadcrumbs cho phần sản phẩm còn phần bài viết thì không có Breadcrumbs. Mình sẽ hướng dẫn bạn thêm Breadcrumbs vào Flatsome hoặc các themes khác kết hợp với Yoast SEO.

Trước tiên bạn vào Advanced của Yoast SEO –> Enable Breadcrumbs

yoast seo

Sau khi đã bật Breadcrumbs trong Yoast SEO rồi thì bạn chèn đoạn code sau vào vị trí mình cần hiển thị.

1
2
3
4
5
6
7
<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb('
<p id="breadcrumbs">','</p>
');
}
?>

Ở đây mình thêm vào file single.php như thế này

1
2
3
4
5
6
7
8
<div class="page-title-inner flex-row medium-flex-wap container">
<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb('
<p id="breadcrumbs">','</p>');
}
?>
</div>

breadcrumb flatsome

Như vậy là mình đã thêm xong Breadcrumbs vào Flatsome kết hợp với Yoast SEO.

5/5 - (100 bình chọn)

Bài viết liên quan :

Chia sẻ theme bán hàng Love Fashion đẹp cho wordpress trên themeforest
Cách tìm file cần sửa của theme đang dùng trong WordPress
Chia sẻ Theme WordPress bản quyền làm trang bán hàng
Mua Laptop Gaming Cần Thơ ở cửa hàng nào ?
Ri Everest v1.2.4 – Theme WordPress làm trang bán hàng chuyên nghiệp
5 WordPress WooCommerce Theme Cao Cấp Miễn Phí
admin

CÔNG TY TNHH CÔNG NGHỆ SỐ THÁI BÌNH Công Ty TNHH Công Nghệ Số Thái Bình - đội ngũ chuyên nghiệp, sáng tạo nội dung, quản trị nội dung, tạo nên giá trị tốt nhất cho khách hàng.