Discussion on Mega Menu Reloaded


Pixelworkshop supports this item


This author's response time can be up to 2 business days.

197 comments found.

Hi, Great work. I’d like to add a search bar to the far right. Is it possible with this?

I tried adding an input form for the search bar but it gets pushed out of navbar when you shrink the width of the page.

I’m sorry if this has been asked before. I’m a new purchaser.


Hello and thanks for using my work ! Unfortunately this menu is coded in a very specific way that would make this kind of addition quite difficult. It should be possible in some way but there would be probably quite a few modifications to make in the CSS as there’s no option to float anything on the right.

Can you give me a head start as to which css attributes to start with. thanks

I don’t have any starter, for this kind of thing there would be different approaches to try and test like playing with floats or positions for example. Without a solution in mind, any suggestion could lead you to a wrong direction.

We’re having trouble installing the Mega Menu Reloaded into two rows. The website is using a main menu that is laid out in two rows (two menu bars on top of each other) with navigation links in both of them. There’s so many navigation items that they just won’t fit into one row/bar. The problem with Mega Menu Reloaded is that it doesn’t work in two rows. Is it a huge amount of work to have two separate menus in one page? So two separate instances of the menu in one page? Just renaming the other (menu + js in header) didn’t work. Looking forward to your soonest reply!

Hello, for more simplicity let’s keep this discussion by email, duplicates don’t help, thanks !

Sounds good. I first posted the question to this Comments area as I didn’t realize it was possible to contact you directly via email. Apologies for that! Hope you can find a solution to our problem.

Great, I’ll get back to you later, thanks :)

Nice menu,

Just wondering if it is under mobile view, can hover become click? This is mostly every megamenu problem.

Desktop = Hover / Click Mobile = Click

Or is there an options to select which select for this kind of scenario

Hey, yes this is how it works. You can test the demo on mobiles, all desktop effects like hover or click are converted to the touch event on mobiles. And all my menus marked as responsive work like that.

Thanks this looks like the menu I need (wish you had a Drupal module ;) ) .Is there a way that the dropdown stays open on active items? If the page that is currently open is inside one of the dropdown menu then that dropdown stays open?

Hope this makes sense ????


Well, it’s still not 100% clear to me. A page is for me a unique URL and this menu can have, on each page, a specific drop down that will be visible when the page loads. In that case, a given drop down remains visible until the user clicks on another menu item (or somewhere outside the menu area but this is another option that can be disabled).

Ok I bought the menu ;) I’m trying to combine the features from “09_megamenu_click_slide.html” and “11_megamenu_panel_onload.html” and I see you’re using the “class=”current”” to have the menu open on load. How can I rather call that in the page content and not in the menu?

Hello, actually it’s an option that you set in the script initializing the menu (in the HTML), there you can set which drop down has to be opened and the class is applied automatically. Or are you trying to do something else…?

Hi, Can you help me with colour as my theme is not black.

Hello, you can contact me from my profile page, also please note that customizations are paid services, thanks !


Very usefull menu! But there is one problem, could you help me with this: in 07_megamenu_hover_slide.html just add ‘123’ symbols to “That there” menu and it being cutted, how i can avoid this situation cause i have dynamic menu on my website and menu name could be different range of symbols… Maybe i can set the number of displaying

  • on one page?

    Waiting for your answer. Thank You!

  • Hello, from what I understand, I’m afraid that there’s no solution in your case, it’s not possible to set a number of items displayed in the menu bar. And because you have a dynamic menu, you couldn’t be sure that items would always fit properly. I don’t see any solution, but in any case you’d need a custom script to handle such a functionnality…

    Is there a way to set the fixed menu in 60_megamenu_hover_fade.html to be hidden at default and have it show when you toggle the arrow?


    Hi, I’ve just replied to your email, thanks !

    AN option to add home icon to the left of home? Please answer asap. I need to purchase.

    My client wants this so can you give free support to add this? or does another one of your menus have this option? he wants home icon, fixed width >100% width dropdown columns.

    None of my menus have this “out of the box” but with basic HTML/CSS knowledge you should be able to do it.

    At the moment I need to buy something with the feature in it.

    Is it possible to make the tabs responsive so that they too are an accordion just like the menu spans?

    Hello, that would be possible but that would mean quite a few customizations in the CSS and in the script.

    Thank you for the response. I’m fine making the changes in the CSS and I’ve already started on them. I am struggling a little with the script changes. If you’re able to provide any insight it would be greatly appreciated.

    Hi, actually it’s a bit too complex to give you any insight, especially if you don’t know where to start. I’m not a javascript expert myself and I experiment a lot before finding how to code something specific.

    Great menu, just trying to get it customised for our website. I have a question – how to many the main menu items justified to full page width, and responsive to resize? Many thanks.

    Hi, thanks for clarifying. I’m not sure if it’s even possible, all the system relies on the position of the menu items so I wouldn’t recommend to change such properties.

    Thanks, I’ve sort of managed to achieve what I wanted to do by setting the padding-left and padding-right of li items to % instead of px.

    Alright, thanks for posting your solution :)

    Is any PHP required for this (if any)? I only have access to the css, html, and javascript.

    I don’t support anything prior to IE9 but this menu was tested to work with IE7, it’s not as smooth as normal browsers but it’s functionnal.

    Even though it is listed as compatible with IE6, IE7, IE8, IE9, IE10, and IE11?

    The list shows the tested browsers, at that time I was still supporting old IE versions.

    Greetings, thanks for your excellent scripts. I’m wondering if it’s possible to combine hover with push?

    Hello and thanks ! Yes for sure, you can try it with the file 05_megamenu_push.html, just replace the option ‘open_close_slide’ by ‘hover_fade’ for example and you’ll see that it works fine.

    You’re right, fantastic! Thanks.

    Hi, can you tell me if it is possible to put a small image (logo) in the menu bar?

    Hello, yes that should be possible, I guess that the best way would be to assign a specific class to the element that will hold the logo and style it via CSS.

    hello is it possible to use your megamenu on shopify ?

    Hi, it’s not designed or coded for shopify, I guess that it can be integrated in some way but I have no experience with this platform.

    I cannot find a way to get the menu to stop showing on hover; I only want the drop down to show on clicking, like in the demo; how do I do this?

    Replied by email, thanks !

    Hello, So i have a dropdown menu that is very long 45 . So i am unable to see the other dropdown menu so can this plugin help to solve the problem?

    Also will this work on a wordpress site?

    Hi, this is not a wordpress plugin.


    I just purchased this menu and had a few issue which I was hoping you could help me with..

    1- How do I change the onhover color when going over the smaller secondary buttons only (example section1, 2, 3, 4) within the dropdown? Its a very dark grey color but I can’t find it anywhere. I’d like to change it to yellow when hovering and when clicked.. can you help with this please?

    2- Right now I have it setup so that onhover the dropdown eases in. I would like it to stay open even when hovering away from it and only closing when clicking on something else. Is this possible? If so can you please provide sets on how to do so?

    Thanks in advance!

    That’s actually what you’ll find in the 02_megamenu_fixed_carousel.html file, it’s fixed at the top.

    That option doesn’t work with push.. I’m looking for sticky top menu and push content. When I try the sticky menu it disables the pushing of content down.

    Maybe it’s something I’m doing wrong. can you send me the code to do that please?


    Ok I see, unfortunately that can’t work, an element using the fixed position is by definition out of the flow of the page so it can’t interact with other elements.