[WooCommerce extension] Hướng dẫn Storefront Mega Menus

Nếu menu mặc định trong theme storefront không thể biểu hiện hết những chuyên mục sản phẩm trong cửa hàng của bạn hoặc bạn cần một menu ngang đa cấp đẹp mà khách hàng chỉ cần rê chuột vào nó sẽ thể hiện hết các chuyên mục sản phẩm có trong cửa hàng của bạn thì bạn dùng [WooCommerce extension] Storefront Mega Menus.

Đây là extension có chức năng thêm menu con (widget) vào menu chính tạo thành các menu ngang đa cấp.

1. Lưu ý

Storefront Mega Menus này chỉ dùng cho theme Storefront.
Storefront Mega Menus này chỉ làm việc tại vị trí Primary Menu

2. Cài đặt

Plugin này cũng cài đặt như các plugin khác. Nếu bạn chưa có điều kiện mua bản quyền thì binhnet.com sẽ cho các bạn cơ hội dùng plugin chất lượng này bằng việc chia sẻ miễn phí phiên bản Storefront-Mega-Menus-1.3.1 Các bạn có thể tải về, upload lên thư mục wp-content/plugin và kích hoạt như thường.

Tải về: Tại đây

3. Hướng dẫn sử dụng

3.1 Thêm một Trình đơn mới ( Add a menu)

Bạn vào Giao diện (Appearance) >> Tùy chỉnh (Customize) >> Menu >> Thêm 1 trình đơn (Add a menu) như hình dưới
Như hình trên sau khi bạn bấm vào Thêm 1 trình đơn (Add a menu) >> bạn điền tên ( ví dụ Mega menu) >> bạn bấm vào Tạo trình đơn (Create Menu)

3.2 Chọn vị trí Trình đơn vừa tạo (ví dụ Mega menu)

Sau khi bạn bấm vào Tạo trình đơn (Create Menu) >> Bạn chọn vị trí như hình dưới
Lưu ý lại rằng  Extension này chỉ làm việc với Vị trí trình đơn là Primary Menu.

3.3 Thêm mục vào menu

Như hình trên bạn bấm vào nút Thêm mục và các bạn thêm vào các thành phần ví dụ Blog, Shop, Cửa hàng … tùy theo ý đồ của bạn như hình dưới
Như hình trên sau khi các bạn thêm các trang như Blog, Shop, Cửa hàng … bạn bấm lại vào nút Thêm mục.

3.4 Cấu hình Mega menu

Bây giờ tôi chọn mục Shop để làm Mega menu thì tôi sẽ làm như hình dưới

3.5 Thêm Widget

Bạn bấm vào nút Add a Widget và ở đây bạn có thể thêm bao nhiêu Widget vào menu Shop cũng được như hình dưới

3.6 Thay đổi kích thước của các Widget

Bạn có thể thay đổi kích thước của Widget bằng cách rê chuột vào góc sau đó giữ chuột và kéo như hình dưới

3.7 Thay đổi thứ tự vị trí của các Widget

Bạn có thể thay đổi thứ tự vị trí của các Widget bằng cách rê chuột vào Widget bạn muốn thay đổi vị trí sau đó giữ chuột và kéo đến thứ tự vị trí bạn muốn như hình dưới

3.8 Xoá Widget

Bạn có thể xoá Widget bằng cách bấm vào nút hình tam giác nhỏ bên cạnh tiêu đề Widget sau đó bấm nút xoá như hình dưới

3.9 Cho phép Mega Menu và Xem trước những thay đổi

Để cho phép Mega Menu, bạn đánh dấu vào mục Enable như hình dưới

Để xem trước những thay đổi bạn chỉ cần bấm vào nút Thu gọn (Collapse menu) như hình dưới

4. Làm thế nào để thêm một cái khác Tiêu đề và liên kết vào Mega Menu

Để làm được điều này bạn cần cài thêm một plugin miễn phí tên là Better Menu Widget và làm theo hình dưới
Như hình trên bạn thấy bạn có thể thêm Tiêu đề nào bạn thích, thêm liên kết vào tiêu đề đó, chọn menu nào bạn muốn. Nhưng bạn cần lưu ý rằng trong mục Menu Classes bạn phải để trống nghĩa là bạn phải xoá chữ sub-menu như mặc định.

Như vậy là chúng ta đã tìm hiểu xong về Storefront Mega Menus. Hi vọng qua bài viết này sẽ giúp cho cửa hàng của bạn hoàn thiện hơn cũng như đẹp hơn.

The post [WooCommerce extension] Hướng dẫn Storefront Mega Menus appeared first on Blog Wordpress.

from WordPress http://ift.tt/2c5MBV2
via IFTTT