8 Bước Tạo Mega Menu Website Chuyên Nghiệp Với Divi Supreme Mega Menu

bởi | 20.02.2024 | WordPress Plugin


Chào bạn. Bài viết này tôi muốn chia sẻ một plugin tạo Mega menu để hỗ trợ bạn xây dựng website chuyên nghiệp hơn mà không cần phải code. Đó là plugin DIvi Supreme Mega Menu, plugin này hỗ trợ tốt cho theme Divi (đây là theme đang áp dụng cho website ABC Digi) Tôi là Tuấn Anh, hiện tại là SEO leader của ABC Digi, và tôi đã làm trong ngành Digital Marketing được hơn 5 năm. Trong thời gian đó, tôi đã nghiên cứu về nhiều plugin để tạo menu cho website ABC Digi. Tôi thấy rằng, việc kết hợp nhiều plugin để làm chức năng cho website khiến web bị “nặng” dẫn đến load chậm. Vì thế tôi viết bài này để chia sẻ về một tạo mega menu tối ưu để bạn xây dựng, dựa theo kinh nghiệm của bản thân tôi và tham khảo từ các nguồn uy tín trong nước và quốc tế.

Tips: tôi sẽ gửi bạn plugin này miễn phí khi bạn tham gia “khoá học tạo website wordpress LvA” trên ABC Digi. Và đương nhiên khoá học này hoàn toàn miễn phí.

[divi_library_shortcode id=”34977″]

Mega menu là gì?

Mega menu la gi 1

Mega menu được biết đến là một dạng tổng hợp các danh mục, nhằm giúp thể hiện các sự lựa chọn có thể xuất hiện cùng lúc dưới dạng dọc hoặc ngang. Bên dưới của menu lớn sẽ chia ra thêm một số menu con được tách ra thành các đầu mục nhỏ hơn.

Xem thêm: 20 Module Chức Năng Xây Dựng Website Chuyên Nghiệp Trong Divi Supreme Pro

Supreme Mega Menu là gì?

Supreme Mega Menu For Divi là một plugin dành cho theme Divi của Elegant Themes, cung cấp cho người dùng tính năng tùy chỉnh menu mega chuyên nghiệp và dễ dàng sử dụng. Với plugin này, người dùng Divi có thể tạo ra menu mega với nhiều cấp độ, hình ảnh và video, phông chữ và nhiều tính năng khác để nâng cao trải nghiệm người dùng website của bạn.

Supreme Mega Menu la gi

Plugin này phù hợp với ai?

Với Plugin Supreme Mega Menu cho Divi, bạn có thể dễ dàng tạo các mega menu đẹp mắt và hiệu quả cho website của mình. Plugin này có các tính năng và tùy chọn cho phép bạn tạo các menu độc đáo. Bạn có thể chọn từ nhiều layout menu, màu sắc, phông chữ và kiểu khác nhau để tạo menu phù hợp cho website của mình. Phù hợp với những người muốn tạo ra một Menu trông đẹpm mắt mà không cần biết nhiều về code.

Xem thêm: Hướng Dẫn Rank Math SEO – Plugin hỗ trợ SEO cho WordPress tốt nhất

Plugin nay phu hop voi ai

Đặc điểm

  • Sử dụng Thư viện Divi cho Mega Menu

Với tính năng này, bạn sẽ có thể tạo các Menu Mega tuyệt đẹp bằng Divi Builder, đồng thời tạo hầu hết mọi loại bố cục và sau đó hiển thị nó dưới dạng Menu thả xuống bằng Mô-đun Supreme Menu Mega.

  • Sử dụng Menu WordPress

Bạn cũng có thể hiển thị Menu WordPress cho menu thả xuống nếu cần, bằng cách này, bạn có thể dễ dàng xây dựng Menu của mình trong Giao diện -> Menu và Tạo Menu của bạn ở đó.

  • Tạo các Menu Mega phù hợp với mọi thiết bị!

Supreme Menu Mega có khả năng tương thích tuyệt vời, Menu của bạn sẽ phù hợp trên mọi thiết bị và nhiều khả năng tùy biết trên các thiết bị khác nhau.

Tao cac Menu Mega phu hop voi moi thiet bi

  • Hiển thị WooC Commerce Cart Counts(Giỏ hàng) & Icon

Bạn có thể bật Sử dụng Biểu tượng giỏ hàng WooC Commerce và hiển thị Sản phẩm có trong Giỏ hàng. Và sau đó tùy chỉnh nó theo cách bạn muốn với các tùy chọn chỉnh sửa.

Xem thêm: Hướng Dẫn Cài Đặt Plugin Akismet – Công Cụ Chống Spam Hàng Đầu Trên WordPress

  • Cho phép mọi người tìm kiếm thông qua mọi thứ trên website của bạn

Bạn có thể nhấp vào Biểu tượng tìm kiếm để xem Menu thả xuống và thậm chí bạn có thể điều chỉnh vị trí và tạo kiểu cho nó từ cài đặt mô-đun.

  • Menu Animation

Plugin này cung cấp cho bạn hơn 30 Animation để bạn lựa chọn cho Mega Menu của mình.

Menu Animation

Tính năng Supreme Mega Menu For Divi

Plugin Supreme Mega Menu For Divi được tạo ra với các tính năng như:

  • Dễ Dàng Tạo Mega Menu Đẹp Mắt

Với Divi Supreme Mega Menu Plugin, bạn có thể dễ dàng tạo ra các Mega Menu đẹp mắt trang web của mình. Các tính năng và tùy chọn đi kèm cho phép bạn tạo ra các menu độc đáo để tăng cường trải nghiệm người dùng trên website của bạn.

  • Khả Năng Tùy Chỉnh Hoàn Toàn

Supreme Mega Menu mang đến khả năng tùy chỉnh không giới hạn với mọi thứ bạn cần để làm cho nó trở nên đặc biệt. Bạn có thể chọn từ nhiều layout menu, màu sắc, font chữ và kiểu dáng.

Xem thêm: 17 Tiêu Chí Quan Trọng Khi Lựa Chọn Hosting

Tinh nang Supreme Mega Menu

  • Kích Thước và Định Dạng Đa Dạng

Plugin hỗ trợ cả bố cục ngang và dọc, giúp bạn dễ dàng thay đổi định dạng theo ý muốn của mình. Bạn cũng có hơn 30 animation để lựa chọn.

  • Tích Hợp Mạnh Mẽ với Divi Builder

Sử dụng Divi Supreme Mega Menu, bạn có thể tận dụng Divi Builder để tạo ra Mega Menu độc đáo và đồng thời thể hiện nó dưới dạng Dropdown.

Cài đặt & Thiết lập plugin Supreme Mega Menu

Hướng dẫn này sẽ giúp bạn trong quá trình Cài đặt và Thiết lập cho Supreme Menu Mega. Chúng ta sẽ xem Cách cài đặt phiên bản Pro và thêm License key để đảm bảo bạn nhận được các bản cập nhật mới nhất đúng hạn.

Bước 1. Tải xuống Plugin

Trước tiên, bạn sẽ cần Tải xuống Plugin Menu Mega tối cao từ Khu vực tài khoản Divi Supreme của bạn -> Tải xuống.

Tai xuong Plugin

Bước 2. Cài đặt Plugin

Bây giờ hãy truy cập Bảng điều khiển WordPress của bạn -> Plugin -> Thêm mới.

Xem thêm: 10 Bước Tạo Tài Khoản Và Làm Website WordPress Miễn Phí

Cai dat Plugin

Bây giờ hãy nhấp vào nút Tải lên ở trên cùng và chọn tệp “supreme-mega-menu.zip” rồi nhấp vào nút Cài đặt.

nhap vao nut Tai len o tren cung va chon tep

Bước 3. Kích hoạt Plugin

Khi bạn nhấp vào nút Cài đặt ngay, nó sẽ đưa bạn đến màn hình tiếp theo và yêu cầu bạn Kích hoạt plugin. Chỉ cần nhấp vào nút Kích hoạt để kích hoạt plugin trên trang web của bạn.

Kich hoat Plugin

Bước 4. Thêm khóa cấp phép

Bây giờ, bước này rất quan trọng, bạn sẽ cần thêm License key để nhận được các bản cập nhật thường xuyên. Để làm điều đó, hãy đi tới Khu vực tài khoản Divi Supreme -> Đơn hàng -> Quản lý giấy phép -> và sao chép mã cấp phép.

Xrem thêm: 04 Bước Và 11 Nguyên Tắc Tăng Tốc Độ & Hiệu Suất Website WordPress

Them khoa cap phep

Bây giờ hãy vào Bảng điều khiển -> Menu Mega tối cao -> Giấy phép và nhập mã Cấp phép của bạn và thế là xong. Bây giờ bạn sẽ nhận được cập nhật thường xuyên cho Plugin Supreme Menu Mega.

nhap ma Cap phep cua ban

Làm thế nào để tạo một Menu Mega?

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách bạn có thể dễ dàng tạo Menu Mega bằng Supreme Menu Mega cho Divi.

Bước 1. Tạo bố cục Menu Mega trong Thư viện Divi

Trước tiên, chúng ta cần tạo nội dung cho Mega Menu trong Thư viện Divi, để làm được điều đó, chỉ cần đi tới Bảng điều khiển -> Divi -> Thư viện Divi và tại đây, hãy nhấp vào nút Thêm mới ở trên cùng và đặt tên cho Bố cục của bạn và thay đổi loại Bố cục thành “Layout”.

Tao bo cuc Menu Mega

Bây giờ bạn có thể bắt đầu tạo Bố cục Menu Mega từ đầu hoặc bạn có thể tải xuống một số layout menu Mega có sẵn mà Divi cung cấp miễn phí với plugin Mega Menu.

Xem thêm: Top 10 Plugin Tối Ưu Hình Ảnh Cải Thiện SEO và Trải Nghiệm Người Dùng

Trong ví dụ của chúng tôi, chúng tôi sẽ sử dụng một trong các bố cục menu mega miễn phí. Đảm bảo chiều rộng nội dung của bạn là 100% để nó trông đủ đẹp trong menu thả xuống Mega Menu. Đây là giao diện của nó trong Thư viện:

giao dien cua no trong Thu vien

Bước 2. Tạo Global Header với Supreme Mega Menu Module

Tiếp theo tạo Tiêu đề toàn cầu bằng cách sử dụng Mô-đun menu Mega. Chỉ cần truy cập Bảng điều khiển -> Divi -> Trình tạo chủ đề và tại đây tạo Tiêu đề chung của bạn.

Tao Global Header

Bây giờ, bạn sẽ ở trong Divi Builder, chỉ cần thêm Mô-đun Menu Mega vào đây.

them Mo dun Menu Mega

Bước 3. Thêm logo của bạn

Bây giờ, trước tiên, bạn có thể thêm nhật ký trang web của mình bằng cách đi tới Bảng “Logo” và thiết lập Logo. Bạn có thể tạo kiểu cho Logo từ tab Thiết kế -> Logo Nếu cần.

Xem thêm: 03 Thành Phần Chính Cần Biết Cấu Tạo Nên Một Website

Them logo cua ban

Bước 4. Thêm các mục menu

Bây giờ logo đã được đặt, bạn có thể bắt đầu thêm Mục menu của mình. Để làm điều đó, chỉ cần nhấp vào Biểu tượng + trong tab “Nội dung”.

Them cac muc menu

Bây giờ, bạn sẽ thấy nhiều cài đặt mới sẽ mở ra được gọi là Menu Cài đặt mục con/mục. Và tại đây, bạn có thể thêm văn bản Mục menu của mình và chọn Bố cục Divi làm Menu thả xuống mà bạn vừa tạo.

chon Bo cuc Divi

Bước 5. Tạo các mục menu đơn giản mà không cần thả xuống

Bạn cũng có thể cần tạo các Mục menu đơn giản không hiển thị bất kỳ danh sách thả xuống nào, chỉ cần thay đổi “Loại nội dung” thành Liên kết, sau đó bạn có thể thêm Liên kết cho Mục menu này trong Bảng liên kết, xem hình ảnh bên dưới để biết hiểu biết tốt hơn.

Xem thêm: 6 Sai Lầm Nghiêm Trọng Khiến Website Bán Hàng Không Hiệu Quả

Tao cac muc menu don gian

Bước 6. Tạo menu thả xuống WordPress

Bạn cũng có thể hiển thị Menu WordPress mà bạn đã tạo trong Bảng điều khiển -> Giao diện -> Menu, chỉ cần thay đổi Loại nội dung thành “Menu WordPress” và chọn Menu mà bạn muốn hiển thị.

Tao menu tha xuong WordPress

Bước 7. Tạo kiểu cho Mô-đun Menu tổng thể

Bây giờ bạn có thể bắt đầu tạo kiểu cho các Mục menu và Danh sách thả xuống theo ý thích của mình, kiểu dáng của mô-đun này rất đơn giản và giống như bạn đang chỉnh sửa bất kỳ Mô-đun Divi nào khác. Bạn sẽ tìm thấy nhiều cài đặt nâng cao để tùy chỉnh hầu hết mọi phần của Mục Menu và Danh sách thả xuống theo ý thích của bạn.

Xem thêm: Bounce Rate là gì mà 80% SEOer hiểu sai? & 15 cách tối ưu

Tao kieu cho Mo dun Menu

Bước 8. Tạo kiểu cho Menu di động

Bạn cũng có thể thiết kế riêng Mô-đun Menu để phù hợp với thương hiệu của mình, bạn sẽ tìm thấy 3 bảng để tạo kiểu cho Menu Di động theo ý thích, xem hình ảnh bên dưới:

Menu di dong

Giá của plugin

GIA 2

Lời kết

Trên đây là tổng quan về Plugin Divi Supreme Mega menu, một Plugin với nhiều chức năng hỗ trợ thiết kế menu website hy vọng sẽ giúp ích cho bạn. Sau khi phân tích sâu về các khía cạnh khác nhau của plugin này, Divi Supreme Mega menu là một công cụ hữu ích cho bất kỳ ai muốn tạo menu website chuyên nghiệp với theme Divi. Từ tính thân thiện với người dùng đến khả năng tùy chỉnh và hiệu suất cao, Divi Supreme Mega menu mang đến nhiều giá trị hữu ích mà bạn khó có thể bỏ qua.

[divi_library_shortcode id=”34977″]

Bài viết này có hữu ích với bạn không? Hãy cho tôi biết đánh giá của bạn nhé!
[Tổng: 0 Trung bình: 0]

0 Lời bình

Gửi Lời bình

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *