Sau một tuần tổ chức workshop tại các trường, BTC nhận thấy nhiều đội thi đang gặp khó khăn trong việc xử lý menus trên website. Một số bạn chưa nắm được cách sử dụng menu trong theme mình đã lựa chọn.
Trong bài viết này chúng tôi tổng hợp những bài giải thích và hướng dẫn từ Bourn Creative và WordPress.org là những nguồn đáng tin cậy để học về WordPress. Đừng quên thực hành ngay trên website của bạn nhé.
Ở cấp độ cơ bản nhất, menu WordPress là một bộ sưu tập/danh sách các liên kết. Vị trí phổ biến nhất của menu là trong khu vực điều hướng trang web hoặc thanh điều hướng, được gọi là menu điều hướng.
Mỗi liên kết trong một menu được gọi là một mục menu. Một số mục menu có thể có các mục menu phụ được hiển thị trong menu thả xuống.
Ảnh minh họa dưới đây là một trang web có menu điều hướng chính, menu tiêu đề phụ và menu thả xuống của các trang phụ trong mục menu Đánh giá.
Menu WordPress có thể được sử dụng ở hầu hết mọi nơi trong trang web WordPress. Ngoài menu điều hướng trang web của bạn, bạn có thể hiển thị menu WordPress trong tiêu đề, trong thanh bên, chân trang hoặc trong bất kỳ khu vực phụ trợ nào.
Tại sao sử dụng menu? Menus làm cho quá trình quản lý nội dung dễ dàng hơn!
Menu WordPress cho phép bạn nhanh chóng tạo một menu tùy chỉnh và dễ dàng thêm các trang, bài đăng, lưu trữ danh mục, lưu trữ thẻ, lưu trữ tác giả hoặc liên kết tùy chỉnh.
Trên màn hình menu, bạn có thể thay đổi tên và tiêu đề của bất kỳ mục menu nào mà không ảnh hưởng đến permalink (URL) của nó và với chức năng kéo và thả, bạn có thể thay đổi thứ tự của các mục menu và tạo menu thả xuống. Ngoài ra, với Tiện ích menu tùy chỉnh WordPress, bạn có thể thêm menu tùy chỉnh vào bất kỳ khu vực được tiện ích nào trên trang web của mình – tất cả mà không cần phải chạm vào bất kỳ HTML nào!
Ngoài ra, CSS tùy chỉnh có thể được viết cho các menu trong thanh bên và chân trang để hiển thị chúng trong lớp danh sách dấu đầu dòng, để sử dụng phông chữ biểu tượng, hình ảnh hoặc nút và để thêm hiệu ứng di chuột.
Responsive menus
Responsive web design – trong đó một trang web được thiết kế để đáp ứng, thay đổi kích thước hoặc điều chỉnh chính nó, dựa trên hành vi của người dùng và môi trường xem – đòi hỏi phải xem xét thiết kế bổ sung cho các menu của trang web. Người thiết kế sẽ phải cân nhắc cách các menu sẽ được hiển thị khi kích thước màn hình nhỏ hơn (hoặc lớn hơn).
Một trong những thiết kế menu di động phổ biến nhất là sử dụng Hamburg Hamburger – một biểu tượng hiển thị ba dòng ngang ngắn đại diện cho một menu. Khi nhấp vào, biểu tượng bánh hamburger sẽ mở rộng xuống dưới để hiển thị menu trang web đầy đủ (như hiển thị bên dưới). Nếu nhiều menu được sử dụng (như hiển thị bên dưới), liệu các menu sẽ được kết hợp hay không và cách thức hoạt động của nó phải được giải quyết.
Nếu bạn đang đọc đến đây, bạn đã có được những hiểu biết cơ bản về menu trang web. Hãy cùng xem phần tiếp theo về cách bạn có thể tạo menu của riêng mình trên WordPress.
Xác định Menu
Bạn phải xác định một menu trước khi bạn có thể thêm các mục vào nó.
Menu tùy chỉnh mới của bạn hiện đã được xác định.
Thêm đầu mục vào menu
Bạn có thể thêm các loại liên kết khác nhau vào menu của mình, chúng được phân chia giữa các bảng bên trái của menu bạn đang chỉnh sửa.
Menu tùy chỉnh của bạn hiện đã được lưu.
Tạo menu nhiều cấp
Khi lập kế hoạch cấu trúc của menu của bạn, sẽ giúp nghĩ về từng mục menu như một tiêu đề trong một tài liệu báo cáo chính thức. Trong một báo cáo chính thức, các tiêu đề phần chính (tiêu đề cấp 1) là gần nhất bên trái của trang; các tiêu đề phụ (tiêu đề cấp 2) được thụt vào bên phải một chút; bất kỳ tiêu đề cấp dưới nào khác (Cấp 3, 4, v.v.) trong cùng một phần đều được thụt vào bên phải.
Trình chỉnh sửa menu WordPress cho phép bạn tạo các menu nhiều cấp bằng giao diện ‘kéo và thả’ đơn giản. Kéo các mục menu lên hoặc xuống để thay đổi thứ tự xuất hiện trong menu. Kéo các mục menu sang trái hoặc phải để tạo các cấp độ phụ trong menu của bạn.
Để biến một mục menu thành cấp dưới của một mục khác, bạn cần đặt ‘con’ bên dưới ‘cha mẹ’ của nó và sau đó kéo nhẹ sang bên phải.
Thêm menu vào trang web
Nếu chủ đề hiện tại của bạn hỗ trợ các menu tùy chỉnh, bạn sẽ có thể thêm menu mới của mình vào một trong các Vị trí chủ đề.
Nếu theme hiện tại của bạn không hỗ trợ tùy chỉnh menu, bạn sẽ cần thêm menu vào mục Custom Menu widget tại Appearance Widgets Screen.
Xin chúc mừng! Menu tùy chỉnh mới của bạn hiện đã được thêm vào trang web của bạn.
—-
Tài liệu tham khảo:
References:
