Thiết lập menu thả xuống trong cửa hàng trực tuyến

Có thể sử dụng menu thả xuống để nhóm các sản phẩm, bộ sưu tập hoặc trang lại với nhau, giúp khách hàng điều hướng cửa hàng trực tuyến dễ dàng hơn. Ví dụ: nếu có nhiều sản phẩm, bạn có thể thêm vào các bộ sưu tập, sau đó dùng menu thả xuống trên menu chính để sắp xếp. Cách này giúp khách hàng tìm thấy loại sản phẩm họ cần.

Bạn cũng có thể thêm, xóa hoặc chỉnh sửa mục menu trong menu thả xuống hoặc menu mặc định.

Có thể xem và thay đổi menu cửa hàng trực tuyến bằng cách vào Nội dung > Menu trong trang quản trị Shopify.

Lồng các mục menu để tạo menu thả xuống

Có thể tạo menu thả xuống bằng cách tạo hoặc di chuyển các mục menu để lồng chúng dưới một mục cấp cao nhất. Mục cấp cao nhất hiển thị trong menu chính trên cửa hàng trực tuyến, còn các mục menu được lồng sẽ hiển thị trong menu thả xuống. Mục cấp cao nhất có thể chứa tối đa hai cấp độ menu thả xuống phân cấp.

Tất cả chủ đề sẽ hiển thị các mục được lồng dưới dạng menu thả xuống từ menu chính và một số chủ đề sẽ hiển thị dưới dạng menu thả xuống ở những vị trí khác.

Menu chính và menu thả xuống hiển thị ở các vị trí khác nhau trên cửa hàng trực tuyến tùy thuộc vào chủ đề. Một số chủ đề hiển thị biểu tượng bên cạnh tên của menu thả xuống trong menu chính để giúp khách hàng nhận biết có menu thả xuống.

Thêm menu thả xuống từ menu chính

Bạn có thể thêm menu thả xuống từ bất kỳ mục nào trong menu chính.

Các bước thực hiện:

Tích hợp menu chân trang

Menu thả xuống cũng có thể được áp dụng trong menu chân trang.

Các bước thực hiện:

1. Từ trang quản trị Shopify, đi tới Nội dung > Menu.
2. Tùy chọn: Làm theo các nguyên tắc lồng áp dụng cho menu chính, chẳng hạn như nhấp vào rồi kéo các mục menu vào đúng vị trí dưới một mục đầu trang để tạo cấu trúc thả xuống.
3. Nhập # vào trường Liên kết đối với các mục đầu trang không liên kết đến trang (ví dụ: đầu trang "Hỗ trợ" hoặc "Khám phá").

Lưu ý về khả năng tương thích của chủ đề

Xem lại các lưu ý sau đây để thêm menu thả xuống vào chủ đề:

• Hầu hết các chủ đề hỗ trợ tối đa hai cấp độ menu thả xuống phân cấp. Hãy kiểm tra tài liệu về chủ đề hoặc thử nghiệm các mục phân cấp để xác nhận khả năng tương thích.
• Một số chủ đề có thể yêu cầu điều chỉnh CSS để cải thiện khả năng sử dụng trên thiết bị di động. Không tùy chỉnh chủ đề nếu bạn không rành về mã chủ đề. Tìm hiểu thêm về cách tùy chỉnh chủ đề.

Xác định xem chủ đề có hỗ trợ menu thả xuống phân cấp hay không

Để xác định xem chủ đề hiện tại có hỗ trợ số cấp độ menu thả xuống phân cấp tối đa mà bạn muốn triển khai hay không, có thể sử dụng các tài nguyên sau:

1. Kiểm tra tài liệu về chủ đề: Xem lại tài liệu về chủ đề để biết thông tin cụ thể về các khả năng của menu cũng như cấp độ phân cấp được hỗ trợ.
2. Thử nghiệm các mục phân cấp: Tạo cấu trúc menu thử nghiệm có số cấp độ phân cấp mong muốn và xác minh rằng cấu trúc đó hiển thị chính xác trên cả máy tính để bàn và thiết bị di động.

Hầu hết các chủ đề hỗ trợ tối đa hai cấp độ menu thả xuống phân cấp. Nếu gặp sự cố với menu thả xuống, hãy xác minh xem chủ đề có hỗ trợ số cấp độ phân cấp mà bạn đang muốn triển khai hay không vì một số chủ đề có thể cần tùy chỉnh thêm để hỗ trợ nhiều cấp độ phân cấp.

Thực hành tốt nhất cho menu thả xuống

Xem lại các thực hành tốt nhất sau để tạo một cấu trúc menu hữu ích và hoạt động tốt trên mọi thiết bị:

• Sử dụng các nhãn có tính mô tả, ví dụ như "Mua sắm theo danh mục", cho các mục menu cấp cao nhất có liên kết #.
• Đảm bảo menu được tối ưu hóa trên thiết bị di động. Bạn có thể kiểm tra menu trên thiết bị di động để xác nhận các menu thả xuống mở rộng như dự kiến.
• Chỉ nên thêm tối đa bảy mục menu cấp cao nhất để tránh làm giao diện quá chật chội.
• Sử dụng tiêu đề liên kết rõ ràng và mang tính mô tả. Ví dụ: "Bộ sưu tập" và "Váy mùa hè".
• Mỗi menu có thể có tối đa 10.000 mục, và cửa hàng có thể có tổng cộng tối đa 1.000 menu. Mọi mục menu có các mục phụ trong menu thả xuống đều được tính là một menu riêng khi xét theo giới hạn này.

Khả năng tiếp cận đối với menu thả xuống

Hầu hết các chủ đề triển khai đầu trang của menu thả xuống dưới dạng nút thay vì liên kết có thể nhấp. Đây là một thiết kế khả năng tiếp cận có chủ đích giúp những khách hàng sử dụng công nghệ trợ năng hiểu được cấu trúc điều hướng.

Khi một mục menu cấp cao nhất kiểm soát một menu phụ thả xuống, mục đó đóng vai trò là một nút để mở rộng menu chứ không phải là một liên kết đến một trang mới. Cách tiếp cận này đảm bảo rằng những khách hàng sử dụng trình đọc màn hình hoặc các thiết bị hỗ trợ khác có thể điều hướng đúng hệ thống menu trên cửa hàng.

Nếu muốn khách hàng truy cập vào trang danh mục chính (chẳng hạn như "Tất cả sản phẩm" hoặc "Tất cả bộ sưu tập"), thì hãy thêm trang này làm mục đầu tiên trong chính menu thả xuống thay vì thiết lập cho đầu trang có thể nhấp.

Khắc phục sự cố thường gặp

Xem lại các giải pháp sau đây đối với những sự cố thường gặp có thể xảy ra khi thiết lập menu điều hướng:

• Chuyển hướng menu trên thiết bị di động: Nếu một liên kết menu cấp cao nhất chuyển hướng đến một trang mới khi chạm vào, thì hãy kiểm tra menu trong bảng điều khiển quản trị Shopify để xác nhận rằng trường liên kết menu là #.

• Sự cố về khả năng hiển thị: Nếu không thấy các mục phân cấp hiển thị, thì hãy đảm bảo rằng những mục đó đã được kéo hoàn toàn vào bên dưới mục đầu trang và được thụt lề trong giao diện Menu. Xác nhận xem chủ đề có hỗ trợ số lượng cấp độ phân cấp mà bạn đã thiết lập hay không.

• Khả năng tương thích của chủ đề: Nếu gặp sự cố với menu thả xuống, hãy xác minh xem chủ đề có hỗ trợ số cấp độ phân cấp mà bạn đang muốn triển khai hay không. Một số chủ đề có thể cần tùy chỉnh thêm để hỗ trợ nhiều cấp độ phân cấp.

• Không thể tạo menu phân cấp: Nếu gặp lỗi "Menu cannot contain nested menus. Opt in the nested navigation feature to use this" (Menu không thể chứa các menu phân cấp. Chọn tham gia tính năng điều hướng phân cấp để sử dụng tính năng này), thì cửa hàng của bạn có thể cần kích hoạt tính năng điều hướng phân cấp. Lỗi này thường ảnh hưởng đến các cửa hàng được tạo trước năm 2018. Hãy liên hệ Bộ phận Hỗ trợ Shopify nếu bạn gặp lỗi này.

• Hiển thị sai menu: Nếu có nhiều liên kết điều hướng trỏ đến cùng một trang (như trang chủ), thì chủ đề có thể hiển thị sai menu phụ. Đảm bảo mỗi phần điều hướng liên kết đến một trang duy nhất để tránh nhầm lẫn.

• Mục menu bị biến mất: Nếu liên kết menu bị biến mất dù không bị xóa, hãy kiểm tra xem bạn đã xóa các sản phẩm, bộ sưu tập hoặc trang mà các mục menu đó liên kết đến hay chưa. Việc xóa tài nguyên được liên kết cũng đồng thời xóa mục menu.

Tùy chỉnh mã chủ đề cho menu thả xuống

Đối với những chủ đề yêu cầu tùy chỉnh sâu hơn, có thể cân nhắc tùy chỉnh mã chủ đề.