NỘI DUNG

Hosting tốc độ cao Vietnix - tốc độ tải trang trung bình dưới 1 giây
VPS siêu tốc Vietnix - trải nghiệm mượt mà, ổn định
20/02/2023
Lượt xem

Hướng dẫn thêm Breadcrumb WordPress vào trang web của bạn

20/02/2023
10 phút đọc
Lượt xem

Đánh giá

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

Breadcrumb WordPress là một trong số những tính năng mang lại nhiều lợi ích cho trang web như giúp người dùng xác định vị trí của người dùng trên web, điều hướng trang, có ý nghĩa tích cực đối với SEO,… Hãy cùng theo dõi bài viết dưới đây của Vietnix để xem hướng dẫn chi tiết từng bước tạo Breadcrumb WordPress đơn giản và hiệu quả nhé.

Khái niệm Breadcrumb là gì?

Breadcrumb là một thuật ngữ dùng để chỉ thanh điều hướng chứa các liên kết ngay trên bài viết và được hiển thị dưới dạng phân cấp để người dùng định vị được chính xác vị trí của họ. Breadcrumbs giúp người dùng dễ dàng điều hướng từ trang này sang trang khác. Trang web càng phức tạp thì cần có breadcrumb để giúp người đọc biết họ đang ở đâu.

Breadcrumb là gì?
Breadcrumb là gì?

Ví dụ về cấu trúc Breadcrumb của một bài viết sẽ có dạng như sau:
Home / Blog / Hướng dẫn tạo Breadcrumb WordPress
Trong đó: Phân cấp lớn nhất là trang chủ (home), tiếp theo là trang lưu trữ bài viết (blog) và cuối cùng là trang chứa bài viết hiện tại mà người dùng đang xem.

Bên cạnh tính năng giúp người dùng biết được vị trí mình đang ở đâu trên website, chúng còn có một số chức năng quan trọng mà nhiều người quan tâm. Đó là giúp các công cụ tìm kiếm hiểu rõ cấu trúc website, từ đó hiển thị trên SERP, tăng tỉ lệ truy cập và cải thiện thứ hạng website trên kết quả tìm kiếm.

Breadcrumb giúp Google hiểu hơn về cấu trúc website trong SEO
Breadcrumb giúp Google hiểu hơn về cấu trúc website trong SEO

Tóm lại, trải nghiệm người dùng và kết quả SEO đều sẽ được cải thiện khi website kích hoạt Breadcrumb. Vậy làm sao để kích hoạt tính năng này, hãy cùng tìm hiểu phần tiếp theo của bài viết.

4 cách thêm Breadcrumb WordPress vào trang web của bạn

Trước khi thực hiện bất cứ thay đổi lớn nào đổi với WordPress, bạn nên tạo một bản backup để đảm bảo dữ liệu và yên tâm khi thực hiện.

Có nhiều cách để có thể tạo Breadcrumb. Phần dưới đây, Vietnix sẽ hướng dẫn bạn 4 cách để tạo Breadcrumb WordPress đơn giản và nhanh chóng để bạn dễ dàng lựa chọn. Trước hết, bạn có thể tham khảo nhanh qua video sau:

Cách 1: Sử dụng Yoast SEO để thêm Breadcrumb vào website WordPress

Bước 1: Cài đặt và kích hoạt plugin Yoast SEO

Yoast SEO là một trong những plugin hữu ích giúp người dùng WordPress tối ưu vị trí và nội dung phù hợp trên công cụ tìm kiếm. Yoast SEO còn hỗ trợ người dùng tạo Breadcrumb một cách dễ dàng trên WordPress.

Nếu bạn là người mới sử dụng WordPress và chưa biết cách cài đặt plugin Yoast SEO cho website WordPress của mình, hãy tham khảo bài viết sau từ Vietnix: Yoast SEO là gì? Hướng dẫn cài đặt và sử dụng plugin Yoast SEO

Sau khi tải về, tiến hành kích hoạt plugin và tiếp tục thực hiện các bước hướng dẫn dưới đây để tạo Breadcrumb:

Bước 2: Thêm đoạn mã Breadcrumb vào child theme WordPress

Bạn cần thêm một đoạn mã ngắn vào theme WordPress của mình để cho Yoast SEO biết vị trí hiển thị Breadcrumb. Đoạn mã code dưới đây có thể thêm vào bất kỳ template nào đang sử dụng. Tuy nhiên, Vietnix khuyến khích nên đặt chúng vào single.php, page.php hay header.php. Những nơi này đảm bảo breadcrumb hiển thị lên mỗi bài viết, trang web và trên toàn website. Sao chép và đăng đoạn mã dưới đây:

<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
}
?>

Trong ví dụ dưới đây, Vietnix sẽ thêm đoạn mã code trên vào vị trí dưới cùng của tệp header.php để hiển thị Breadcrumb trên toàn website WordPress:

Thêm Breadcrumb vào website WordPress
Thêm Breadcrumb vào website WordPress

Bước 3: Kích hoạt và định cấu hình Yoast Breadcrumb trogn cài đặt plugin

Khi đoạn mã được thêm vào theme, việc tiếp theo bạn cần làm là kích hoạt Breadcrumb trong cài đặt plugin Yoast SEO.

Truy cập vào mục SEO > Search Appearance > Breadcrumbs trong bảng điều khiển Dashboard WordPress.

Trong mục Breadcrumbs Setting hãy chuyển đổi công tắc thành Enabled. Tại đây, bạn có thể định cấu hình cài đặt Breadcrumb theo nhu cầu. Ví dụ: Để chọn một phân loại để hiển thị trong Breadcrumb cho bài đăng của mình, Vietnix sẽ chọn mục Category.

Ngoài ra, bạn có thể giữ nguyên hoặc việt hóa các từ ngữ đối với site tiếng việt. Sau khi thực hiện các thay đổi hãy kéo xuống và nhấn lưu lại

Hướng dẫn tạo Breadcrumb WordPress bằng Yoast SEO
Hướng dẫn tạo Breadcrumb WordPress bằng Yoast SEO

Như vậy, bạn hoàn thành việc thêm Breadcrumb vào website WordPress với công cụ Yoast SEO rất đơn giản. Và dưới đây là giao diện của bài đăng sau khi bật Breadcrumb.

Giao diện sau khi bật Breadcrumb WordPress
Giao diện sau khi bật Breadcrumb WordPress

Cách 2: Thêm Breadcrumb vào website WordPress bằng Breadcrumb NavXT

Bước 1: Cài đặt plugin Breadcrumb NavXT

Nếu bạn không sử dụng Yoast SEO để thêm Breadcrumb WordPress hoặc muốn có nhiều tùy chỉnh hơn thì việc sử dụng plugin Breadcrumb NavXT là một giải pháp dành cho bạn. Các bước thực hiện cụ thể như sau:

Đầu tiên, bạn chuyển đến phần Plugin của WordPress > Add new plugin > Nhập từ khóa Breadcrumb NavXT vào ô tìm kiếm.

Cài đặt plugin Breadcrumb Navxt để thêm Breadcrumb vào website WordPress
Cài đặt plugin Breadcrumb NavXT để thêm Breadcrumb vào website WordPress

Bước 2: Cài đặt plugin để cấu hình Breadcrumb WordPress

Để kích hoạt Breadcrumb giúp chúng hiển thị lên trang web, bạn có thể kéo thả chúng vào cất cứ vị trí nào mong muốn. Ví dụ: vị trí footer (chân trang) hoặc sidebar (thanh bên). Để thêm Breadcrumb vào website WordPress bằng Breadcrumb NavXT bạn làm như sau:

Điều hướng chuột đến Appearance > Widget. Sau đó, kéo thả tiện ích Breadcrumb NavXT vào khu vực widget bạn muốn và lưu cập nhật.

Thêm Breadcrumb vào website WordPress bằng plugin Breadcrumb NavXT
Thêm Breadcrumb vào website WordPress bằng plugin Breadcrumb NavXT

Sau khi kích hoạt, bạn nhấn chọn Settings > Chọn Breadcrumb NavXT để di chuyển đến phần cấu hình cho plugin. Nhiều tùy chọn mà bạn không thể tìm thấy ở Yoast SEO sẽ được hiển thị. Về cơ bản, bạn không cần thay đổi mà có thể giữ nguyên tất cả để sử dụng.

Chọn mục Setting Breadcrumb NavXT
Chọn mục Setting Breadcrumb NavXT

Khi hoàn tất bạn nhấn chọn Publish để hoàn tất việc tạo Breadcrumb.

Cách 3: Sử dụng theme WordPress tích hợp Breadcrumb

Ngoài 2 cách thêm Breadcrumb Vietnix vừa hướng dẫn phía trên, cách đơn giản nhất mà bạn có thể tạo Breadcrumb WordPress là tận dụng các theme có sẵn tính năng này. Một tính năng tiện lợi như Breadcrumb sẽ được hầu hết các nhà phát triển theme tích hợp chung để hỗ trợ người dùng.

Đối với một số theme thì chúng sẽ được hiển thị cố định nên bạn không cần phải làm gì khác. Tuy nhiên một số theme khác thì bạn sẽ cần kích hoạt trong thư mục Customize của WordPress hoặc cấu hình trong bảng tùy chỉnh riêng của nó.

Dưới đây là một số loại theme phổ biến, chất lượng có hỗ trợ Breadcrumb mà Vietnix gợi ý đến bạn để tham khảo sử dụng như sau:

Đối với những khách hàng, khi sử dụng WordPress Hosting tại Vietnix đều có thể sở hữu miễn phí theme được tích hợp sẵn thanh điều hướng Breadcrumb và cùng toàn bộ bộ sưu tập theme từ MyThemeShop và WP Astra Growth. Bên cạnh đó, dịch vụ web hosting này còn cung cấp hơn 500 mẫu website đa dạng lĩnh vực như sức khỏe, giáo dục, công nghệ, thời trang,… giúp bạn dễ dàng tùy chỉnh và thiết kế với chỉ một cú click. Các mẫu này không chỉ ấn tượng mà còn tương thích đa thiết bịị, mang đến trải nghiệm mượt mà cho người dùng.

Cách 4: Dùng Breadcrumb của trình tạo theme WordPress

Trình tạo theme WordPress sở hữu nhiều công cụ hỗ trợ thiết kế hữu ích, chính vì vậy bạn cũng có thể sử dụng chúng để tạo tính năng Breadcrumb. Đối với một số Theme Builder như: Elementor Pro, Thrive Theme Builder,… bạn có thể thêm vào một cách dễ dàng nhờ modules có tên “Breadcrumb”. Bạn chỉ việc kéo thả để thêm hoặc kích hoạt tính năng Breadcrumb đã được tích hợp sẵn trong theme chỉ với vài thao tác đơn giản.

Hướng dẫn thêm Breadcrumb trong Elementor Pro
Hướng dẫn thêm Breadcrumb trong Elementor Pro

Lời kết

Trong bài viết trên, Vietnix đã hướng dẫn chi tiết các cách giúp bạn có thể tạo Breadcrumb WordPress đơn giản. Hy vọng nội dung bài viết sẽ giúp bạn đọc có được những thông tin bổ ích và thực hiện thành công khi áp dụng theo những cách đã được chia sẻ. Đừng quên chia sẻ bài viết cho bạn bè nếu cảm thấy hữu ích nhé.

THEO DÕI VÀ CẬP NHẬT CHỦ ĐỀ BẠN QUAN TÂM

Đăng ký ngay để nhận những thông tin mới nhất từ blog của chúng tôi. Đừng bỏ lỡ cơ hội truy cập kiến thức và tin tức hàng ngày

Chọn chủ đề :

Lê Nam

WordPress Expert
tại

Kết nối với mình qua

Kết nối với mình qua

Theo dõi
Thông báo của
guest
0 Comments
Phản hồi nội tuyến
Xem tất cả bình luận

Tăng tốc độ website - Nâng tầm giá trị thương hiệu

Banner group
Tăng tốc tải trang

95 điểm

Nâng cao trải nghiệm người dùng

Tăng 8% tỷ lệ chuyển đổi

Thúc đẩy SEO, Google Ads hiệu quả

Tăng tốc ngay

SẢN PHẨM NỔI BẬT

MAXSPEED HOSTING

TĂNG TỐC WEBSITE TOÀN DIỆN

CÔNG NGHỆ ĐỘC QUYỀN

PHẦN CỨNG MẠNH MẼ

HỖ TRỢ 24/7

ĐĂNG KÝ NGAY
Pattern

7 NGÀY DÙNG THỬ HOSTING

NẮM BẮT CƠ HỘI, THÀNH CÔNG DẪN LỐI

Cùng trải nghiệm dịch vụ hosting tốc độ cao được hơn 100,000 khách hàng sử dụng

Icon
ĐĂNG KÝ NHẬN TÀI LIỆU THÀNH CÔNG
Cảm ơn bạn đã đăng ký nhận tài liệu mới nhất từ Vietnix!
ĐÓNG

ĐĂNG KÝ DÙNG THỬ HOSTING

Asset

7 NGÀY MIỄN PHÍ

Asset 1

ĐĂNG KÝ DÙNG THỬ HOSTING

Asset

7 NGÀY MIỄN PHÍ

Asset 1
Icon
XÁC NHẬN ĐĂNG KÝ DÙNG THỬ THÀNH CÔNG
Cảm ơn bạn đã đăng ký thông tin thành công. Đội ngũ CSKH sẽ liên hệ trực tiếp để kích hoạt dịch vụ cho bạn nhanh nhất!
ĐÓNG