Mobile Menu with Max Mega Menu

[hauke.t]

Hello!
We use the theme “SKT Ele Pet”.
I have installed the plugin “Max Mega Menu” like described in your docs to be able to customize the menu better. I would also like to customize the mobile menu so that menus with many sub-items are not too long.
This has worked quite well in the desktop version so far. However, the mobile menu is apparently not being customized. Your standard menu continues to appear there, not the menu customized by the plugin.
How can I change this?

You can find the page at https://tierisch-gut-therapiert.de
I have also noticed that the logo is significantly larger in the mobile view than on the desktop. Can this be adjusted?

Thank you very much!

[Sonl Sinha]

Hi,

Unfortunately your SKT Elements Pro package has expired.

Kindly renew your package by buying it here: https://www.sktthemes.org/shop/elementor-wordpress-theme/

We look forward to welcoming you again into our family.

Regards,
Dave

[hauke.t]

Hi Dave,
I’m happy to inform you that the templates have been updated!
Can you help me with this?
Regards, Hauke

[Sonl Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media (max-width: 479px) {
.logo { max-width: 100px;}
}

@media screen and (max-width: 63.938em) and (min-width: 20em) {
#topmenu { display: block; top: 20px; position: relative;}
#simple-menu { display:none;}
#mega-menu-wrap-primary { top: 30px;}
}

Regards,
Dave

[hauke.t]

Hi Dave!
Thanks for the customized CSS.

If I set this on the desktop or in the Customizer, it works perfectly. The menu is displayed as desired.
It also works great in the minimized browser window.
However, when I call up the page on an iphone, the old menu is still displayed. It looks as if the new button appears very briefly, but is immediately overwritten by the old menu.

Do you have any idea what could be causing this?
Thank you very much!
Hauke

[Sonl Sinha]

Hi,

Can you send us the screenshot of your issues? Upload your screenshot on https://imgbb.com/ and paste the share url here.

Regards,
Dave

[hauke.t]

Hi Dave!
As requested, you will receive the screenshots as a link. I have three screenshots there:
1. view in the SKT-Customizer in WordPress: https://ibb.co/cJx0GNP
2. view in the reduced browser window: https://ibb.co/ZfmnHVZ
3. view on the iPhone: https://ibb.co/72fmQ8t

Thanks for your help!
Best regards!

[Sonl Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media screen and (max-width:479px) {
 .touchon #topmenu {
    display: block !important;
  }
   .touchon #simple-menu {
    display: none !important;
  }
}

Regards,
Dave

[hauke.t]

Hi Dave!
That worked really well.

Now I would like to know if you can change the behavior. In the Max Mega Menu settings there is the following option: “Overlay content –
If enabled, the mobile sub menu will overlay the page content (instead of pushing the page content down). This will only work if the menu/header is not sticky.”
Regardless of whether I activate this or not, the content is always pushed down. However, it would look better if the menu was overlaid over the page.

Many thanks and best regards!

[Sonl Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media screen and (max-width:479px) {
#footer.footer-type3 .rowfooter { margin:0 !important;}
.center { overflow: inherit !important;}
#topmenu { top: 0px; width: 65%;}
#mega-menu-primary { top: 70px !important;}
.mega-menu-toggle { float: right;}
}

Regards,
Dave

[Author]

Posts