Max Mega Menu is a multifunctional WordPress menu plugin. Horizontal Dropdown Menu Super WordPress Plugin Mega Menu WordPress

    This can be done using styles.
    But you need to understand that you have the Menu then you need to move from the top to the Sidebar, which you do not have yet.
    Well, that is, if this Theme allows, connect the Sidebar on the right side and drag the Menu into it.
    And to make it vertical, just add / change CSS

    Main-navigation ul li, .secondary-navigation ul li (display: block! Important;)

    Well, after that, you need to change the indents and other properties a little.

    Perhaps I misunderstood you, but my Max mega menu is already in the area of \u200b\u200bthe left column (it is black, lined up in 2 lines due to the area being reversed, and so it is horizontal by default in the plugin), added there through the widgets, in the upper part I have a standard theme menu and I need both of them, now I will try the CSS, thanks

    It is possible that I also did not quite understand you correctly.
    I was talking about the menu that you have on the screen in the horizontal upper block of light green color "Tea Coffee Sweets ..."
    But after reading your answer, I understand that we are talking about different menus.
    On the screen you see on the left side this is the Max mega menu, but I do not see it on the site using your link.
    And since I did not see him yesterday, then I did not look at the screen.
    I don’t see it now either.

    I try to do something all the time, put different things on and off, until I figured out how to make this menu vertical, I'm looking for another suitable one. For this menu, the same solution using css can be applied as you wrote? Could you tell me which part of the code to insert these lines into the code of the plugin itself? Does location matter?
    I went Plugins-edit-chose Max mega menu, then there are such sections:
    css
    megamenu.scss
    reset.scss
    toggle-blocks.scss
    admin
    mixin.scss
    Found no similar lines in any of them to fix

    I'm just a noob and didn't understand why you need it to be displayed on me, apparently to look at the code and suggest. I found the admin's answer in the Max Mega Menu support forum that vertical is only available in the Pro (paid) version, so for now it will have to be abandoned. Could you please advise any similar plugin, the criteria are as follows:
    - the ability to install in the sidebar
    - the menu must be dropdown
    - when switching to any of the categories, so that it remains open at this stage, and does not close completely with a page refresh

    Exactly.
    Without seeing this very Menu, it is impossible to give advice and recommendations. Perhaps a couple of lines of CSS is enough. But not a fact.

    Although, if you really plan to use this Max Mega Menu revealing all its possibilities, then for such a product $ 23 is not much at all. It's worth it.

More recently, such a feature as Mega Menu was the destiny of exclusively premium plugins and themes. But today, dear readers, I will present to you two completely free plugins that will allow you to quickly, easily and, of course, completely free of charge, build a powerful navigation menu on your site, which is not so much inferior to paid counterparts.

What is Mega Menu anyway? Yes, the same, familiar navigation menu with which you have probably already encountered and customized more than once. It's just that, unlike the standard functionality, there are still additional options for customizing and displaying individual elements. For example, adding not only a vertical, but also a horizontal submenu, adding icons and individual images to the menu, detailed adjustment of the appearance for all menu items, and so on. All of this is in our plugins we are reviewing today.

Another great opportunity to add a super awesome navigation menu with plugin to your website is Mega Menu by WooRockets.com. Installation and activation of the plugin are standard.

This plugin is somewhat more difficult to learn, but it also offers more opportunities than the above-described competitor. Menu building here is very similar to page building in standard Visual Composer.

Go to the section WR mega menu in your admin area and click on Add New... We get to a new page to build a new menu. Those who have already dealt with Drag & drop composers before will immediately feel at home. The process of building a menu is not much different from building a page.

First, make sure that at the top of the menu - Location exactly the menu you need is indicated. Or click on Menage Location to select a menu.

Click - Add Element and select the type of content that you want to add to the menu in the pop-up window. At the top left, you can choose one of the standard suggested options or add WordPress widgets.

If necessary, add rows with a break into the required number of columns. On the left are tabs for dragging menu items up or down, and on the right are tabs where you can enable editing or deletion. Do not forget to press the familiar button on the right - Post or - Refresh to preserve the results of their labors.

In general, any texts, pictures, and, if desired, any widgets can easily be placed in your new menu. The appearance of the menu can be changed by clicking on the button Styling or insert your tables next to the button Custom CSS.

A very functional contraption, in short. No wonder the authors, in addition to this plugin, also have: a contact form and, of course, a composer, which apparently served as the basis for the mega menu plugin. You can watch a working demo in all its glory here.

Great and powerful plugins with which you can practically create the menu of your dreams. The only thing that can darken the joy of users a little is the issue of compatibility with different themes. Unfortunately, as far as I remember, premium plugins sometimes had this question. I tested both plugins on a standard theme and did not notice any problems or bugs. What I wish you too, friends!

As far as I understand, the term mega menu in WordPress means a super-functional huge block with many different elements: lists, pictures, texts, sliders, etc. You've probably met such people. Someday I will publish a full-fledged selection on the topic, but today we will talk about a very specific solution - the Max Mega Menu plugin. I chose it because I already tested it in work for, it often gets on the lists, plus there is one of the most intelligent and constantly developing free (Lite) versions.

Immediately after installing Max Mega Menu in WordPress, your standard navigation is transformed into a more powerful and functional mechanism with the ability to add various kinds of widgets, a convenient editor and a bunch of additional settings. Download the plugin from here or search for it through the WP admin panel.

At the moment, the minimum required version of the system is 3.8, it works up to the latest version 4.8.3 now. Downloads about 100 thousand. I like that over the past 2 months, almost 70 different bugs out of 89 have been fixed, which indicates that the developers are very active.

Main functions and features of Max Mega Menu

  • Several placements are supported, for each of which you can choose your own parameters;
  • Easy work with navigation elements via Drag & Drop.
  • Adding.
  • There is a convenient theme editor.
  • Adding any widgets: pictures, texts, lists, etc.
  • Trigger condition: on hover, click.
  • Submenu output effects: exit, fade in / out, etc.
  • Various additional options such as hiding text / links or turning them off on the mobile version. The last point will help to simplify the creation of a separate one.
  • Alignment for menu items.

To understand how cool and convenient all this is, I advise you to just watch the following video:

In addition, the developers can boast of a very correct and correct approach to creating their solution. WordPress Max Mega Menu is a really high quality product, here are a couple of proofs:

  • all styling is set using a single CSS file, where the "famous" property important is not used at all;
  • retina support, responsiveness, triggering on smartphones and tablets (tested in almost all existing desktop and mobile browsers);
  • clean code, JS scripts when gzipped will take less than 2Kb;
  • support for different filters / hooks;
  • detailed documentation + unlike many other plugins, the support forum is quite lively.

Setting up and working with Max Mega Menu

Immediately after installation, the section of the same name will appear in the admin panel. In the "General Settings" you can tweak several options regarding the behavior of submenus, mobile devices, etc. The Topics look much more interesting.

There are 6 tabs with different chips at once:

  • Basic - choose the type of arrows, shadows, line height, etc.
  • Menu bar - design of the main block: backgrounds, indents, fonts, hover.
  • Mega Menus - Mega Menu styles and settings.
  • Dropdowns - a similar set of styles.
  • Mobile Menu - screen size for triggering and other options of the mobile menu.
  • Custom design - add your own CSS styles.

After the main parameters are set, go to the WP section of the admin panel "Appearance" - "Menu".

You need to select the menu that you want to work with, and then in its settings put a checkmark in front of "Enabled". You can activate Max Mega Menu in WordPress only when the menu has a specified display area in the template (header, footer, sidebar, etc.). There are also parameters for effects and trigger events.

To open the module editor, hover the cursor over one of the hierarchy items and click on the "Mega menu" button that appears. A pop-up window will display the corresponding tool, which you may have seen in the video presentation of the plugin above.

Here you can, firstly, determine the number of columns, as well as add any widgets. In addition, resizing of each element is allowed. Selecting widgets is allowed only in the first (main) navigation level. If you click on the "Mega Menu" button opposite other elements, then only to set icons and different properties:

Hiding text / links, aligning and disabling on desktop / mobile is a very useful set of functions. It is allowed to set similar options in each menu item. Remember to save your changes.

Max Mega Menu Pro and Conclusions

In general, this development has a separate site in addition to the repository. It contains descriptions of all the module's features, provides documentation and a small demo of it, as well as a link to technical support and downloads. The cost of the advanced version of Max Mega Menu Pro, in principle, is not so high - for 1/5/99 sites it will cost you $ 23 / $ 35 / $ 99, respectively. This includes update and support throughout the year. If you are a developer, then by taking a Pro Business License and installing the plugin on 5 sites, you will get the total cost of the solution \u003d 7 dollars!

What is included in Max Mega Menu Pro:

  • Google Fonts integration, FontAwesome and custom icons in settings.
  • Support for vertical and menu accordion type.
  • General logo in navigation + search block.
  • Styles of individual items.
  • WooCommerce and EDD support.
  • Customizable.
  • Search, icons / logos and HTML for mobile elements.
  • Auto-update and priority support.

For ordinary classic sites, the usual free version of Max Mega Menu in WordPress is quite enough, which is very good in functionality. There are a lot of different settings here. I also liked that the developers support their offspring, fix current bugs relatively quickly and take care of the cleanliness / correctness of the code. It will take some time to familiarize yourself, but it's worth it. To make it easier to understand how the plugin works - watch the video and read the documentation.

Which Mega Menu modules in WordPress do you use and why? Have you worked with this solution, what can you add to it?

Mega Main Menu it is a plugin for quick menu creation for wordpress. It has special features that make it easier to use.

  • Sticky and dropdown menus, icons, logo and search.
  • Various colors. Moreover, you can change the color of any option in the menu. In addition to colors, gradients, backgrounds and images are also used.
  • The content has up to 10 variations. You can also place content in dropdown menus. It can contain everything from links to images and shortcodes.
  • Up to 1600 icons can be used in the site menu. These icons have vector graphics, so they do not require large volumes and resolutions. This will allow you to use them even on a cell phone.
  • Fonts also have their own variety. It can use 600 google fonts, which can be easily configured in the plugin settings.


The plug-in is installed in the usual way, like all programs, and there are no difficulties. After you have activated it, then you should go to the main menu. On this menu page, on the left side, you will see four options. This is the main option with general settings, then the option for setting the appearance of the page called skins, which changes the color, font, etc. Also the last two options are support link and special settings for professionals.

In the General options there are three options under options: primary, mobile_menu, secondary. The primary section is used to configure all the main menu values. For example, there you can set the height, anti-aliasing of icons, adjust the logo image. In mobile and secondary, these settings are reproduced separately.


In the Skins settings there are also three variations of settings: primary, extra, footer... In the first option, we can customize the background of the primary container and select horizontal, vertical and radial views. Then the font of the first paragraph, etc.


In specific parameters, you can set the recall for portable devices. Then you can set the screen resolution and style.

The last option is to customize the site structure. Here you choose which option to enable and which to disable.

So this is a great menu plugin that can transform your theme. With its help, you can easily fill it with icons, pictures and other elements. The main thing is its quality is that it has easy functionality. Unlike others plugins Mega Main Menu has negligible impact on the site.

It is widely known that WordPress 3.0 has added support for custom menus (custom menus). The thing, in my opinion, is extremely convenient and useful. Actually, hence this article.

The convenience lies in the fact that now you can create and configure the menu directly from the admin panel, adding links by clicking on the checkboxes and changing the order of links by simply dragging and dropping. In the menu, you can add links to pages, categories and individual posts. You can create multi-level menus, you can also add your own arbitrary links to the menu, which WordPress does not know about. In general, complete freedom of action.

However, for such "freedom" to be available, it is necessary, let's say, with a slight movement of the mouse, to set up the output of an arbitrary menu to the template.

It will be extremely convenient to use such menus if you use the multisite feature of WordPress, because you can set up different menus for different sites, and use the same template for them.

Note: the menu works through the WordPress taxonomy (nav_menu), and arbitrary (external) links are written to the main posts database table. This approach is more flexible and dynamic, but it requires constant generation of such menus.

Register_nav_menus (array ("top" \u003d\u003e "Top menu", // Name of the menu location in the template "bottom" \u003d\u003e "Bottom menu" // Name of another menu location in the template));

We have now registered 2 menus with IDs "top" and "bottom" with their corresponding names. Identifiers are needed to use them in the theme, to indicate the place where, through the output function wp_nav_menu (), the menu created in the admin panel will be displayed. We will see the names of the registered locations in the admin panel when we go to the Appearance -\u003e Menu section.

After the menus are registered, go to the admin panel and create our own menus (in this example, 2 menus):

    Set the name of the menu (the menu in the template can be displayed by the specified name, using the wp_nav_menu () function

    Create menu items. Using the left block: link pages, headings

  1. We choose where the menu will be located, since we have registered 2 menus, we will have 2 options: "Top menu" and "Bottom menu".

Support for custom menus in WordPress is enabled for each theme separately, with such a line in the functions.php file add_theme_support ("menus"); However, this line is not necessary if we register a menu. In this case, support will be enabled automatically.

Displaying arbitrary menus via the wp_nav_menu function

Menus are registered and created, it remains to add them to the template. This is done by the wp_nav_menu () function, which can take the following parameters:

Wp_nav_menu (array ("menu" \u003d\u003e "", // (string) The name of the displayed menu (specified in the admin panel when creating the menu, // has priority than the specified location theme_location - if specified, then the theme_location parameter is ignored) "container" \u003d\u003e " div ", // (string) Menu container. Wrapper ul. The container tag is specified (by default in the div tag)" container_class "\u003d\u003e" ", // (string) class of the container (tag div)" container_id "\u003d\u003e" " , // (string) id of the container (div tag) "menu_class" \u003d\u003e "menu", // (string) class of the menu itself (ul tag) "menu_id" \u003d\u003e "", // (string) id of the menu itself ( ul tag) "echo" \u003d\u003e true, // (boolean) Display or return for processing "fallback_cb" \u003d\u003e "wp_page_menu", // (string) Used (fallback) function if the menu does not exist (failed to get ) "before" \u003d\u003e "", // (string) Text before each link "after" \u003d\u003e "", // (string) Text after of each link "link_before" \u003d\u003e "", // (string) Text before the anchor (text) of the link "link_after" \u003d\u003e "", // (string) Text after the anchor (text) of the link "depth" \u003d\u003e 0, / / (integer) Nesting depth (0 - unlimited, 2 - two-level menu) "walker" \u003d\u003e "", // (object) A class that collects the menu. Default: new Walker_Nav_Menu "theme_location" \u003d\u003e "" // (string) Location of the menu in the template. (the key is indicated with which the menu was registered in the register_nav_menus function)));

In this example, you need to insert approximately (depending on the parameters you need) into the template the following 2 codes:

#1. Display menu by location

Top Menu.We insert into the template header (header.php), where the top (top) menu will be displayed:

"menu", "theme_location" \u003d\u003e "top", "after" \u003d\u003e "/")); ?\u003e

Will display the menu created in the admin panel, attached to the "Top Menu" location with a similar structure:

Lower menu.Insert it into the template footer (footer.php), where the bottom (bottom) menu will be displayed:

Will display the menu created in the admin panel, attached to the "Bottom Menu" location. The structure will be identical to the first.

Note that in the first version, the parameters were passed through an array. In the second, through the line Both options are correct. This is common for WordPress functions - parameters can be passed either as an array or as a string (the string is then converted to an array).

# 2 Display the menu by name

To display a menu by its name, you can use the "menu" argument. The name is indicated, the one that was set when creating the menu in the admin panel. In our example (see picture) "Main menu". The menu argument has a higher priority than theme_location, which means that if we display by name, then the theme_location parameter will be ignored.

You can specify the menu ID, not the name. So, if you change the name of the menu, the code will remain working. The menu ID can be viewed in the URL while editing the menu:

Notes

Remove the wrapper Div

You may have noticed that the menu is often "wrapped" with an unnecessary div tag. It can be removed by specifying an empty "container" \u003d\u003e "" parameter in the arguments for the wp_nav_menu () function.

Changing the default parameters

To avoid constantly specifying the same parameter for inserted menus, they can be overridden in functions.php. This is done through the wp_nav_menu_args filter:

Register_nav_menus (array ("top" \u003d\u003e "Top menu", "bottom" \u003d\u003e "Bottom menu")); add_filter ("wp_nav_menu_args", "my_wp_nav_menu_args"); function my_wp_nav_menu_args ($ args \u003d "") ($ args ["container"] \u003d ""; return $ args;)

Similarly, you can create your own default arguments: $ args ["argument"] \u003d "value".

Checking if the menu is registered

WordPress also has a condition function: has_nav_menu ("top") - checks if the top menu location has been registered. If the menu is not specified, then the wp_nav_menu () function will work like wp_list_pages (), but the div wrapper will remain, despite the fact that we removed it in the arguments. You can solve this problem like this:

If (has_nav_menu ("top")) (wp_nav_menu (array ("container" \u003d\u003e "", "theme_location" \u003d\u003e "top", "menu_class" \u003d\u003e "menu"));) else (echo "

"; }