Support » Plugin: Max Mega Menu » grid layout problem

  • Resolved killerisko

    (@killerisko)


    Hello,

    problem is a little bit complicated to explain for me, but I hope, you can understand it and help me with it, with this image:

    https://i.imgur.com/JFqucTA.jpg

    Any ideas how to achieve that? In default menu I got deep parenting of sub menus correctly, but max mega menu is not showing it correctly with grid layout setting.

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author megamenu

    (@megamenu)

    Hi Killerisko,

    Thanks for reporting this. You’re quite right, those 4th level items should be indented. I’ll make a fix in the next update.

    In the mean time please go to Mega Menu > Menu Themes > Custom Styling and insert the following:

    #{$wrap} #{$menu} li.mega-menu-item.mega-menu-megamenu ul.mega-sub-menu ul.mega-sub-menu ul.mega-sub-menu ul.mega-sub-menu ul.mega-sub-menu {
      margin-left: 10px;
    }

    Regards,
    Tom

    Thread Starter killerisko

    (@killerisko)

    Your fix works perfectly! 😉 Thanks!

    Another problem with The mobile menu is visible but nothing happens when I click it

    I read about it and I am sure that wp_footer() is calling before </body> and I cant find any other solution how to fix it :/ Mobile menu toggle is also off.

    Can you help me here, or I need to create another topic? Thanks

    Plugin Author megamenu

    (@megamenu)

    Hi,

    Good to hear that worked.

    Please check the “Fix Mobile Menu” section on this page:

    https://www.megamenu.com/documentation/divi/

    Regards,
    Tom

    Thread Starter killerisko

    (@killerisko)

    Great! I fixed it 😉

    Could you help me with another problem and its that if I click section, for example: http://mojkredenc.sk/nasa-ponuka/napoje/sirupy/herbert/ , this menu item is not highlighted in max mega menu grid layout. I guess that this can be set with

    Highlight Current Item
    Apply the ‘hover’ styling to current menu items.

    I got this activated, but my current location in menu is still not highlighted.

    Thanks!

    Plugin Author megamenu

    (@megamenu)

    Hi killer,

    Please see:

    https://www.megamenu.com/documentation/highlight-active-menu-items/

    (there are some notes on how/why there can be issues with highlighting sub menu items, so please read carefully!)

    Regards,
    Tom

    Thread Starter killerisko

    (@killerisko)

    I activated Highlight current item options in Menu Bar.

    And I inserted code in custom styling :

    /* Apply Hover Styling to active Mega Menu - Second Level Links */
    #{$wrap} #{$menu} > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
    #{$wrap} #{$menu} > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
        color: $panel_second_level_font_color_hover;
        font-weight: $panel_second_level_font_weight_hover;
        text-decoration: $panel_second_level_text_decoration_hover;
        @include background($panel_second_level_background_hover_from, $panel_second_level_background_hover_to);
    }
    
    /* Apply Hover Styling to active Mega Menu - Third Level Links */
    #{$wrap} #{$menu} > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
    #{$wrap} #{$menu} > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
        color: $panel_third_level_font_color_hover;
        font-weight: $panel_third_level_font_weight_hover;
        text-decoration: $panel_third_level_text_decoration_hover;
        @include background($panel_third_level_background_hover_from, $panel_third_level_background_hover_to);
    }
    
    /* Apply Hover Styling to active Flyout Links and ancestors */
    #{$wrap} #{$menu} li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
    #{$wrap} #{$menu} li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link {
        @include background($flyout_background_hover_from, $flyout_background_hover_to);
        font-weight: $flyout_link_weight_hover;
        text-decoration: $flyout_link_text_decoration_hover;
        color: $flyout_link_color_hover;
    }

    But any of sub menus is still not highlighted :/

    Plugin Author megamenu

    (@megamenu)

    Hi Killer,

    The CSS above will apply the hover styling to active menu items.

    In your theme setup, there is no hover style on the second/third level items (it is the same as the non-hover). If you edit the theme and change the hover font color on third level items, for example, to red, you should see that “active” items become red.

    If you do not want to add a hover style, you can edit the above CSS directly. E.g. change:

    color: $panel_third_level_font_color_hover;

    to

    color: red;

    Regards,
    Tom

    Thread Starter killerisko

    (@killerisko)

    You are great Tom! You helped me a lot!! Thanks! 😉

    Thread Starter killerisko

    (@killerisko)

    Maybe just one more thing 😉 Could you give me some little advice how to make my grid menu looks little better? Just wondering if you, like a creator of this awesome plugin, have any cool easy ideas 😉

    For example, to add css to make little underline under first level sub menus
    like https://imgur.com/mOQhmf2

    or something else with colors? I am not sure :/

    Many thanks for your time!

    Plugin Author megamenu

    (@megamenu)

    Hi Killer,

    You can add that border using the Mega Menu > Menu Themes > Mega Menus > Second Level Menu Items > Border option.

    Otherwise I don’t have suggestions sorry. I’m not a designer – just a coder. I can work to existing designs, but not come up with them myself (if I do then they generally look terrible!) 🙂

    Regards,
    Tom

    Thread Starter killerisko

    (@killerisko)

    Thanks Tom! 😉

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘grid layout problem’ is closed to new replies.