How to build MEgaMenu

alexdb19

Hello,

It is possible to build a mega menu ? with columns and pictures/ background? Thanks

Phil

Hello,

Please, check the following video tutorial:

https://support.muffingroup.com/video-tutorials/how-to-use-mega-menu/

There you will find an explanation on how to create a mega menu with the background image.

If you want to use pictures, then you need to put a <img> tag as a menu item.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

can the column have a Header (bold, for example) . how long can the the text for the column?

Phil

You can replace the sign "-" with your text, and it will become a bolded header of the column.

The text can be as long as you want. Please, check the following screenshot:

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

My dear friends. Please help me. I have tried to make the menu conform your instructions. I have watched all the videos. Please I cannot modify the font size, or make all the buttons equal from the mega menu. Can you please enter to my website and check so I can have un understanding of what to do. Thanks

Phil

Hey,

Please send us WordPress dashboard access privately thru the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact and we will check what might be the reason.

Notice!

Please attach a link to this forum discussion.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

i have send you

Phil

Sorry, but the login credentials you have sent are not working.

Can you check them, or send the correct ones, please?

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Phil

To change the font size for the Mega Menu, you need to put the following code in Betheme -> Theme options -> Custom CSS & JS -> CSS.

#menu .mfn-megamenu .menu-item span{
   font-size: 20px!important;
}

The menu items are not equal because some of them have more text than others, which needs to fit somewhere. Therefore, if you want all of them to be similar, you need to shorten the text.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

You have to look again. there is submenu on menu and NOT show. Why? Please check the megamenu.

Phil

The mega menu can be only one depth deep, so you cannot create sub items for the sub-items.

Best regards

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

ok, can you help me making the space between buttons lower, and have a bold title on top?thanks

Phil

For decreasing the space between the menu items in the mega menu, please, use the following code:

.mfn-megamenu li ul li a{
   padding-top: 5px!important;
   padding-bottom: 5px!important;
}

To add a bold title at the top, replace "-" with the title, and add the following code:

.mfn-megamenu-title{
   font-weight: bold!important;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

it is possible to make the img background from megamenu, more transparent? Like 70% opacity?

Phil

You can use a semi-transparent image in png or webp extension.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexdb19

1. .mfn-megamenu-title{
2.    font-weight: bold!important;
3. }

this is always all CAPS? can it be and lower ?

Phil

You can use the following CSS:

#Top_bar .menu > li > ul.mfn-megamenu a.mfn-megamenu-title{
   text-transform: none!important;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next