Submenu (or megamenu) with 2 columns and highlight on hover

edited February 2016 in Menu / Mega menu
Hello, I've tried looking for this answer in other responses you've given before but everything I try is not working: 

I want one of the menu options (ATELIERS) to have a submenu with 2 columns. 

Basically I would like it to be as it is now, but with 2 columns ( or more columns as more portfolios are added) > the reason of this is because if I add too many subpages I am afraid the length of the submenu will just go out of the screen ( not desired). >> which brings me to the question if it is possible to limit the length of the submenu (or edit the columns of it)

That is the reason why I decided to go with Megamenu, but I cant make it have 2 columns OR have the highlighted hover effect. Is there any way of having megamenu have the same "highlighted" effect  as the regular submenu when it hovers? 

( For the columns)> I've tried these two options that i've seen in other responses... but it doesnt work, the first option reduces it to 3 columns... : 
#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-2 { width: 350px !important; }
#Top_bar .menu > li > ul.mfn-megamenu { width: 700px !important; }

and 
#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-4 {
    text-align: center;
    width: 50% !important;
URL: http://www.offcyclers.com/ateliers
I will keep the Megamenu and eliminate the CSS so you can get a clear idea of what I can do. 

Please help!

Million thanks!

Comments

  • Hi,

    all details about creating Mega Menu, you can find on http://themes.muffingroup.com/betheme/documentation/#menu and please notice that's the only explanation we got. Please check this and you will understand how to create mega menu.

    Thanks!
  • MAYBE I WASN'T CLEAR... 

    All i want to do is have the SUBMENU in 2 columns... I don't need it to be Megamenu... 

    Do you have a fast and easy CSS that can do the work? The explanation in your Document is pretty difficult to understand...

    Million thanks! 



  • To get sub-menu in 2 columns, you need to use Mega Menu. Any css won't do it.
  • edited February 2016
    Ok, so I'm really trying, I promise I'm trying... and i'm really sorry for being such a pain in the ass with this... but I have no idea what this means... 

    "For Mega Menu columns you must add each menu item using a # "URL" attribute and - as the"Navigation label" value. Under the empty columns you can add the correct menu items.
    "But if you want columns with "Titles" at the top, then instead of a dash (-),you must type in your own value." 

    I dont understand what it means by # "URL" attribute... and where do I explain I want it in 2 columns? I' sorry but its really confusing...

    I've seen in the past how you've given people the CSS code to just create a specific number of columns in Megamenu... can you please give me some help?

  • URL is link attribute. http://snag.gy/nz59P.jpg - this is what we mean.
  • Hi offcyclers - were you able to find out how we can submenu with 2 columns? I do agree the documantation is not enough clear. A screenshot with an exemple would be great.
Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.