Khi thêm menu vào theme WordPress bằng hàm register_nav_menu
và hiển thị với wp_nav_menu
, menu sẽ có cấu trúc mặc định với các menu con nằm trong thẻ <ul>
có class sub-menu
và mỗi thẻ <li>
sẽ có class riêng.
Walker_Nav_Menu
start_lvl()
<ul class="sub-menu">
).wp_nav_menu()
.end_lvl()
</ul>
).wp_nav_menu()
.start_el()
<li id="menu-item-5">
).wp_nav_menu()
.end_el()
</li>
).wp_nav_menu()
.Để tùy biến cấu trúc menu trong WordPress mà không phải chỉnh sửa trực tiếp mã nguồn, bạn có thể tạo một lớp mới kế thừa từ Walker_Nav_Menu
. Cụ thể, bạn sẽ tạo lớp VNEngineer_Nav_Walker
của riêng mình, kế thừa từ Walker_Nav_Menu
, và tùy chỉnh lại các phương thức như start_lvl()
, start_el()
, v.v., để thay đổi cấu trúc hiển thị theo ý muốn.
Toàn bộ mã của lớp Walker_Nav_Menu
có thể được xem từ dòng 10 đến dòng 191 trong tập tin /wp-includes/nav-menu-template.php
của mã nguồn WordPress. Việc xem xét các đoạn mã này sẽ giúp bạn hiểu cách thức hoạt động của nó và dễ dàng thực hiện các tùy chỉnh cần thiết cho lớp mới của mình.
Lưu ý rằng khi tùy biến lớp Walker_Nav_Menu
, bạn chỉ cần khai báo lại những phương thức mà bạn muốn thay đổi. Không cần phải khai báo lại toàn bộ các phương thức của lớp gốc. Tuy nhiên, nếu bạn quyết định tùy chỉnh một phương thức, bạn phải viết lại nó chính xác như đã được định nghĩa trong /wp-includes/nav-menu-template.php
. Bất kỳ sai sót hoặc thiếu sót nào trong việc khai báo phương thức sẽ dẫn đến lỗi trong quá trình thực thi.
Với các menu đơn giản từ 1 đến 2 cấp độ, bạn có thể sử dụng Walker_Nav_Menu
và wp_nav_menu
để tùy chỉnh thông qua các tham số như class và các thẻ bao HTML. Tuy nhiên, nếu bạn cần làm việc với menu đa cấp phức tạp, có cấu trúc thẻ và thuộc tính phức tạp, thì cách tốt hơn là sử dụng hàm để lấy thông tin mảng dữ liệu của các menu đã cấu hình trong admin. Từ đó, bạn có thể tùy chỉnh và tạo giao diện menu theo nhu cầu của mình một cách linh hoạt hơn. Xem thêm bài viết: Lấy mảng dữ liệu các mục menu trong Wordpress