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:
Trong đó, bạn có thể thay đổi dấu “/” ở dòng $args[‘sep’] = ‘ / ‘; 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. :)
Dũng đã bình luận:
21/02/2016 at 02:21bạn xem lại nhiều bài viết mất đoạn code hướng dẫn rồi nha
Trung Hiếu đã bình luận:
21/02/2016 at 02:45Mình đang tiến hành thay đổi một số thứ nên code gặp lỗi tạm thời không hiển thị được. Bạn thông cảm quay lại xem sau nhé. :)
Trung Hiếu đã bình luận:
21/02/2016 at 04:30P/S: Mọi thứ trở lại bình thường rồi nhé. Mình vừa chuyển hết hình ảnh qua lưu trên subdomain để giảm tải cho domain chính. Sẽ có bài hướng dẫn cụ thể cho anh em. :)
Aplite đã bình luận:
22/04/2017 at 09:55Mình thì mình toàn Sử dụng plugin Yoast SEO, thấy nó rất hiệu quả, không cần phải chỉnh hay phải cài thêm bất kỳ plugin nào.
Vũ Trung Hiếu đã bình luận:
26/06/2017 at 18:18Bread Crumbs
Đúng thứ e đang cần ^^
V An. đã bình luận:
26/06/2017 at 22:43Thật khó hiểu khi mình cài đặt cái Yoast và sau đó bật breadcrumb lên nhưng lại không hiển thị được breadcrumb. Nếu xem trong inspect thì chỉ thấy , không biết xử lý thế nào. Mong được bạn giải thích.
Cảm ơn nhiều.
Trung Hiếu đã bình luận:
26/06/2017 at 23:29Theme không hỗ trợ breadcrumbs chứ sao nữa. :P Xem cái này đi thanh niên. :P
mrleezoo đã bình luận:
13/11/2017 at 09:22Chào Hiếu, trang mình có sử dụng breadcrumb tùy biến trong code. Xin hỏi giờ mình muốn tùy chỉnh màu sắc của breadcrumb thì tùy chỉnh ở phần nào vậy ?
Trung Hiếu đã bình luận:
13/11/2017 at 15:36Màu sắc thì bạn tùy chỉnh bằng CSS nhé. Thường là chỉnh trong style.css. :P
mrleezoo đã bình luận:
15/11/2017 at 13:59Cảm ơn bạn. Mình mới mày mò code dựa theo nền tảng cũ của web nên đã làm thành công rồi heheh. Đang nghiên cứu thêm mấy thủ thuật WP bạn share :D
Hiếu Lê đã bình luận:
15/03/2018 at 14:32Cập nhật Genesis lên chỉnh breadcrumbs trong Yoast SEO không được nữa anh ơi, không biết bị sao luôn!
Trung Hiếu đã bình luận:
15/03/2018 at 14:36Bản 2.6.0 lỗi nhé. Lên hẳn 2.6.1 đi. Họ fix lỗi đó trên bản mới nhất rồi. :P
Hiếu Lê đã bình luận:
15/03/2018 at 14:38Bản 2.6.0 em làm bình thường, lên 2.6.1 cái hết được luôn, chắc phải bỏ vào file functions.php quá
Trung Hiếu đã bình luận:
15/03/2018 at 14:42Mình lỗi ở bản 2.6.0. Lên 2.6.1 thì hết lỗi. Họ cũng thông báo trong changelog như vậy mà. :P
Hiếu Lê đã bình luận:
15/03/2018 at 14:50Em cũng đọc changelog rồi, mà không hiểu tại sao, lúc lỗi lại được, khi fix xong lại lỗi
Trung Hiếu đã bình luận:
15/03/2018 at 15:00Kiểm tra xem trên file functions có sót code nào liên quan đến breadcrumb không? Và đã thiết lập breadcrumb trong Genesis => Theme Settings chưa?
Hiếu Lê đã bình luận:
15/03/2018 at 15:22Em làm hoành tráng hết rồi anh, nhưng không hiểu sao nó bị lỗi, e kiểm tra trong file breadcrumbs.php thì nó thay đổi 1 chút từ 2.6.0 lên 2.6.1:
elseif ( class_exists( 'WPSEO_Breadcrumbs' ) && genesis_get_option( 'breadcrumbs-enable', 'wpseo_internallinks' ) )thay thành:
( class_exists( 'WPSEO_Breadcrumbs' ) && genesis_get_option( 'breadcrumbs-enable', 'wpseo_titles' ) )E chuyển về bản 2.6.0 của file này nhưng vẫn giữ genesis ở 2.6.1 thì hiển thị OK anh, như vậy chắc không ảnh hưởng gì đâu a nhỉ, với chắc cũng có nhiều người gặp phải lỗi này ở phiên bản 2.6.1 ý a, a viết bài hướng dẫn luôn a :p.
phúc đã bình luận:
16/01/2019 at 17:08cùng lúc sử dụng cả hai cái vừa theme có sẵn và Yoast SEO thì có sao không bác
Trung Hiếu đã bình luận:
16/01/2019 at 17:44Không vấn đề gì bạn nhé. Mình đang dùng cả breadcrumbs của Genesis lẫn Yoast SEO đây.
Lộc Phát đã bình luận:
05/03/2019 at 16:17Cái này giờ còn hiệu quả không admin ơi ? E có dùng trong yoast seo nhưng không thấy hỗ trợ từ khóa lên top gì cả
Trung Hiếu đã bình luận:
05/03/2019 at 17:03Tác dụng chính của Breadcrumbs là làm đẹp kết quả tìm kiếm => tăng tỉ lệ click vào kết quả tìm kiếm bạn ạ.
Lộc Phát đã bình luận:
05/03/2019 at 21:22Cảm ơn bạn, lâu nay cứ nghĩ có thể hỗ trợ thúc đẩy từ khóa lên top nhanh hơn
long đã bình luận:
29/03/2019 at 11:28A Hiếu cho em hỏi mình chèn schema breadcumblist rồi nhưng bật breadcum của theme lên khi kiểm tra bằng search.google.com/structured-data/testing-tool/. thì nó hiện ra tới 2 loại schema breadcumblist và schema breadcum. Mà e thấy mấy bài viết của a thì lại không bị vậy .Như vậy sao để khắc phục cho nó khỏi trùng lặp a.
Trung Hiếu đã bình luận:
29/03/2019 at 11:44Bỏ đi 1 cái chứ sao nữa bạn. :D Mình dùng Schema Pro, Yoast SEO và Genesis Framework, chúng tương thích lẫn nhau nên khi cái này bật, cái kia sẽ ẩn. :P
long đã bình luận:
29/03/2019 at 11:49Nhưng nếu k bật cái breadcumb của theme thì nó không hiển thị với người dùng. mà chỉ bật k của theme thì nó lại bị lỗi. A Hiếu xem dùm e thừ đó là lỗi gì vậy : https://botcoluami.net/bot-co-lua-mi/bot-co-lua-mi-va-5-luu-y-ma-nguoi-moi-su-dung-can-phai-biet/