HƯỚNG DẪN TẠO MENU NGANG ĐA CẤP ĐẸP VỚI PLUGIN MEGA MENU

Mega Menu đã là xu hướng cùng chọn lựa tất yếu hiện nay trong những website cả ngơi nghỉ toàn nước cùng nước ngoài. Trong WordPress tất cả một nghệ thuật call là walker. Cho phxay chỉnh sử menu bởi code HTML, nó hơi là phức tạp. Tại sao chúng ta không sử dụng Plugin Mega Menu, một phương pháp đơn giản dễ dàng hơn để tiếp cận cùng sử dụng Mega Menu. Trong bài viết này tôi sẽ khuyên bảo chúng ta tạo nên Mega Menu bằng Plugin miễn chi phí mang tên là Max Mega Menu

Demo:

*

Các kỹ năng nhưng mà plugin này mang đến là:

Plugin này được cho phép các bạn tuỳ đổi mới menu theo ý thíchĐặt những widget vào menu, bất kỳ widget nào các bạn đang download vào websiteCho phép kéo thả các widgetMục Mega menu gồm 6 cộtMenu IconsKích hoạt hiệu ứng bằng phương pháp Hover hoặc ClickHiệu ứng hoạt cảnh xuất hiện: Fade và SlideTương say mê với màn hình di độngCó 3 kiểu mũi tên dropdownTuỳ chỉnh cấu hình trong AppearanceLàm việc với nhiều MenuVẫn chuyển động khi jquery bị loại bỏ hoáResponsiveRetina ReadyAn toàn Lúc gỡ cài đặt, Lúc gỡ thiết đặt thực đơn của bạn sẽ trsinh sống về ban bối cảnh ban đầuHoạt hễ bên trên IE9+, FireFox, Opera, Safari và Chrome

Chưa được test trên IE8 trnghỉ ngơi xuống

Một số tác dụng khác:

Plugin này sẽ không dìm style từ bỏ menu cũ của bạn, bạn cũng có thể tạo ra đồ họa mới từ bỏ Menu ThemesMenu CSS auto so sánh SCSSMax Mega Menu cân xứng cùng với những Widget cùng plugin Menu đầu ra cađậy ( https://wordpress

org/plugins/widget-output-cache/ ) cũng giống như WPhường Super Cache

Các widget được đặt vào Mega Menu cũng khá được giữ y như các widget không giống vào Appearance / Widgets

Các đề xuất của plugin:– Website WordPress của người tiêu dùng bắt buộc là bản 3.8 trsinh hoạt lên.– Plugin này chỉ rất có thể vận dụng cùng với đông đảo Menu đang mix địa chỉ trong Menu Settings / Theme locations , chẳng hạn như Primary Menu, Footer Menu,…

Cách 1: Cài đặt

Dĩ nhiên, phần đâu tiên là bạn yêu cầu thiết đặt plugin Mega Menu. Chọn Plugins / Add new nhập vào ô search tìm Mega Menu, các bạn sẽ thấy nhiều plugin chất nhận được làm phần lớn này. Tôi lựa chọn cài đặt plugin Max Mega Menu, đơn giản dễ dàng bởi vì nó miễn tổn phí và dễ dàng áp dụng. Sau Khi setup chấm dứt ta lựa chọn Active plugin.

Bạn đang xem: Hướng dẫn tạo menu ngang đa cấp đẹp với plugin mega menu

Bước 2: Kích hoạt tuấn kiệt bên trên Main Menu

Tiếp theo, ta vào mục Appearance / Menus

*
Ở phần này các bạn làm theo công việc sau:1. Hãy chắc chắn là rằng thực đơn bạn đã có phối địa chỉ vào phần Menu Settings / Theme locations, vì còn nếu không thì mục 2 không được hiển thị những tuỳ lựa chọn.2. Mục này các bạn sẽ chọn Enable anh tài Mega Menu vào menu.Các tuỳ chọn tiếp theo là :

Event: Lựa lựa chọn sự kiện hiển thị menu con (Mega Menu)Hover: khi bạn gửi con chuột quaClick: khi chúng ta cliông chồng chuộtEffect: Hiệu ứng hiển thịNone: Không cần sử dụng hiệu ứngFade: làm cho mờ lúc xuất hiện và Khi thay đổi mấtSlide: Hiệu ứng trượtTheme: Giao diện của Main Menu. Mục này tôi vẫn lý giải chúng ta nghỉ ngơi bước tiếp sau.

3. Tuỳ phát triển thành menuMục này bọn họ vẫn lưu ý đến phần Mega Menu Options. Đây chính là bước đặc biệt độc nhất.Configure Panel Widgets for |Page|

*
Đây là phần chúng ta tuỳ trở thành những widget trên Mega Menu, những chúng ta cũng có thể đặt bất kỳ webget nào nhưng chúng ta vẫn cài đặt vào site của bạn. Bạn hoàn toàn có thể thay đổi form size của widget bởi hai mũi tên trái với đề xuất cạnh thương hiệu widget. Tổng form size chiều ngang (độ rộng) bằng chiều rộng của Main Menu
*
Các tuỳ lựa chọn tiếp sau là:

Sub Menu Type: Kiểu của menu conFlyout Menu: Tên mặc định của bên chế tạo plugin (phần này ta lựa chọn Mega Menu Panel)Mega Menu Panel: Hiển thị Mega menuSub Menu Position: Hiển thị vị trí của menu con, phía trái hoặc bên đề xuất. Tuỳ vào ý ham mê của người tiêu dùng.Menu Icon: Icon của mục thực đơn này. Quý khách hàng có thể lựa chọn tuỳ ý theo các chắt lọc gồm sẵn.

Xem thêm: Hướng Dẫn Kiểm Tra Drm Key Là Gì, Drmkey Là Gì

Sau Lúc lựa chọn phần đông tuỳ lựa chọn tương xứng, hãy Save Menu để áp dụng thay đổi.

Bước 3: Tạo theme Mega Menu

lúc vẫn hoàn thành vấn đề hiển thị Mega Menu, chúng ta mới bắt đầu tuỳ phát triển thành đồ họa thực đơn.Appearance / Menu Themes

*
Nếu bạn đã vừa lòng cùng với cấu hình ban đầu của Mega Menu với mong tạo thành theme một giao diện khác thì clichồng vào Create a new theme, còn nếu không chúng ta vẫn hoàn toàn có thể chỉnh sửa trên theme mặc định mang tên là Default.Các mục bắt buộc chụ ý:

Theme Title: Tên Theme, có thể đổi tên tuỳ ýMain Font: Kiểu font chữ của menuResponsive sầu Breakpoint: Nhận diện hiển thị trên di động cầm tay bởi chiều rộng màn hìnhMenu Background: Màu nền background của Main MenuMenu Padding: Padding main menuRounded Corners: Bo góc menuPanel Background: màu sắc nền của sub menuPanel Width: Độ rộng lớn sub thực đơn (Nên để 100%)Widget Padding: Padding những widget bên phía trong mega menu

Tuỳ lựa chọn sau cùng vào theme mega menu chính là Custom Styling nếu khách hàng biết chút ít về CSS hay những code thì không cần thiết phải giải thích các về mục này nữa rồi.Đây là mục sửa đổi CSS tuỳ phát triển thành, được ghi đè lên các cấu hình phía trên mà lại ta sẽ chọn. Nếu các bạn không ưng ý cùng với những tuỳ lựa chọn gồm sẵn, bạn cũng có thể từ CSS trên mục này.

*

Sau Khi gồm những chọn lọc cân xứng cùng với ý ham mê của người tiêu dùng, đừng quên clichồng Save Changes nghỉ ngơi footer nhé.Cuối thuộc là quay lại mục Appearance / Menus. Trong Mega Menu Settings hãy chọn theme Mega Menu nhưng mà chúng ta đã tuỳ vươn lên là với Save sầu MenuChúc các bạn bao gồm một chiếc Mega Menu đẹp bên trên website của công ty.