Thanh danh mục nằm ngang ngay dưới header điện thoại, vuốt ngang được. Khách chạm một mục thì bảng con mở ra ngay tại đó, không chuyển trang. Bảng con chứa được ảnh, sản phẩm và banner.
Trước khi làm: đã cài Navi+ và bật Store Connector trong theme.
1Chọn loại menu
Trong Navi+ bấm Add menu rồi chọn thẻ Mobile Mega Menu.
2Hai cách bắt đầu
Dựng từng bước
Bấm Create from your website > Build it step by step. Thêm 3 đến 8 mục cho thanh ngang: gõ tên, rồi chọn Link để dẫn thẳng tới một trang hoặc Submenu để mở bảng con. Với mục Submenu, màn kế hỏi chọn link bên trong và một kiểu hiển thị (Icon + Title + Desc, Title + Desc, Title only hoặc Grid), rồi bấm Generate menu.
Từ mẫu hoặc tự dựng
Bấm Create from a template > Browse templates. Chọn một mẫu rồi Use this template (có Quick test để xem thử), hoặc chọn thẻ Blank để có menu trống rồi tự Add item.
3Chỉnh tay tiếp
Dù dựng từng bước hay từ mẫu, bạn vẫn chỉnh tay ở Build Menu: cấp 1 là các mục trên thanh ngang, cấp 2 và 3 là nội dung trong bảng con của mục đó. Kéo thả đổi thứ tự, bấm một mục để đổi tên, link, ảnh. Sang Design để đổi màu: Main menu cho thanh ngang, Sub menu cho bảng con.
Giới hạn: tối đa 3 cấp. Cấp 1 chỉ hiện chữ, không có icon. Màn hình điện thoại nhỏ nên giữ bảng con gọn để khách chạm chính xác.
4Mẫu item tiêu biểu
Chọn một mục cấp 1 rồi bấm + ITEM để mở popup Add item và thêm nội dung vào bảng con của nó. Đây là những mẫu hay dùng nhất.
Danh sách và lưới: phần ruột của bảng con
Trong Links & icons: List (dòng link gọn), List with icons (icon trước mỗi dòng), Icon grid và Image grid (lưới icon hoặc ảnh có tên). Khách nhận ra nhóm hàng nhanh hơn với ảnh hoặc icon so với dòng chữ.
Banner và Cards
Trong Cards & banners: ảnh lớn có chữ và nút, để đẩy một chiến dịch hay bộ sưu tập mới ngay trong bảng con.
Khối sản phẩm tự động
Trong Live sections: New arrivals, Best sellers, Shop by category hay Custom rule. Sản phẩm tự lấy theo collection và tự làm mới, tối đa 20 mỗi khối. Chỉ Shopify.
Campaign spot
Ô chừa sẵn cho chiến dịch: gán vào thì hiện Tag (HOT, SALE), đếm ngược hoặc banner theo lịch, hết hạn tự gỡ.
HTML block
Trong Media & code: dán mã HTML (video nhúng, form đăng ký, widget) vào bảng con. Mã chỉ chạy khi khách mở bảng nên không làm chậm trang. Chỉ dán mã bạn tin cậy.
Shopify menu (nhúng nguyên menu Shopify), Sticky line và Menu reference chỉ có ở Mobile Menu, không dùng được trong Mobile Mega: Mobile Menu.
5Publish: đặt thanh dưới header
Mở Publish, chọn chỗ đặt rồi bấm Turn on. Thanh nằm trong trang nên cần một chỗ đặt; Navi+ đã tự tìm sẵn chỗ ngay dưới header trên theme của bạn. Mặc định thanh chỉ hiện trên điện thoại.
Add below your header
Một thanh full-width chèn ngay dưới header trên điện thoại. Menu điều hướng của theme vẫn còn nguyên, nên khách có thêm một hàng danh mục để chạm.
Cần chỗ khác, ví dụ trước hay sau một phần tử bất kỳ? Chọn Somewhere else và dùng CSS selector.
Dùng cùng Mobile Menu và Tab Bar
Thanh ngang chỉ chứa vừa vài danh mục chủ lực. Nhiều cửa hàng để Mobile Mega bày sẵn các danh mục chính, Mobile Menu giữ toàn bộ phần còn lại, Tab Bar lo lối đi nhanh ở đáy màn hình.
Xem cách kết hợpNền tảng khác
Các bước ở trên dành cho Shopify — đây là cách mặc định.
Trên Wix, Add menu mở thẳng bộ chọn mẫu thay cho trình dựng ở trên; chọn Mobile Mega Menu và một mẫu rồi sửa trong màn sửa menu. Wix không có khối app “Menu in Section”, chỉ đặt được bằng CSS selector. Khối Live sections chỉ có trên Shopify.
Trên WordPress và website khác, Add menu mở thẳng bộ chọn mẫu thay cho trình dựng ở trên; chọn Mobile Mega Menu và một mẫu rồi sửa trong màn sửa menu. Không có khối app “Menu in Section”, chỉ đặt được bằng CSS selector. Khối Live sections và Shopify menu chỉ có trên Shopify.