How to upgrade a mobile theme for DJ-MegaMenu 3.7?

How to upgrade a mobile theme for DJ-MegaMenu 3.7?

DJ-MegaMenu 3.7 comes with a new feature that allows displaying mobile menu button in 3 different ways: icon, icon and text, or text only.

This new feature may require additional CSS styles, especially if your template contains a mobile theme for DJ-MegaMenu or you created your own mobile theme.

Ready to use custom styles

If you experience some problems with the mobile menu button after updating DJ-MegaMenu module, we prepared ready-to-use CSS styles which you can copy and paste to your theme or Joomla template:


div.dj-megamenu-select .dj-mobile-open-btn,
div.dj-megamenu-offcanvas .dj-mobile-open-btn,
div.dj-megamenu-accordion .dj-mobile-open-btn {
display: inline-block;
width: auto;
padding: 3px 8px;
}
div.dj-megamenu-select .dj-mobile-open-btn span + span,
div.dj-megamenu-offcanvas .dj-mobile-open-btn span + span,
div.dj-megamenu-accordion .dj-mobile-open-btn span + span {
margin-left: 12px;
}
div.dj-megamenu-select .dj-mobile-open-btn:focus,
div.dj-megamenu-select:hover .dj-mobile-open-btn,
div.dj-megamenu-offcanvas .dj-mobile-open-btn:hover,
div.dj-megamenu-offcanvas .dj-mobile-open-btn:focus,
div.dj-megamenu-accordion .dj-mobile-open-btn:hover,
div.dj-megamenu-accordion .dj-mobile-open-btn:focus {
text-decoration: none;
}
div.dj-megamenu-select.select-button {
width: auto;
}
div.dj-megamenu-select.select-button select {
width: auto;
max-width: 9999px;
text-indent: 9999px;
}
div.dj-megamenu-accordion {
position: relative;
text-align: center;
}
div.dj-megamenu-accordion.dj-align-left {
text-align: left;
margin: 0;
}
div.dj-megamenu-accordion.dj-align-right {
text-align: right;
margin: 0;
}
      • Related Articles

      • Color customizer in DJ-MegaMenu

          A new feature in DJ-MegaMenu allows you to customize the look and feel of your menu. We've added the option to modify the menu's colors the way it'll look exactly as you need. Color customizer is available only in the FULL version of DJ-MegaMenu ...
      • Module options

        DJ-MegaMenu module is necessary to display the menu in the module position.  Navigate Extensions > Module Manager and choose the DJ-MegaMenu module. Let's take a look at Module Parameters: Menu Name – The name of the menu (default is main menu) Base ...
      • Options in menu item

         Remember to enable the DJ-MegaMenu system plugin, it will display an additional parameter tab in the menu item form. Let's see the available options in the menu item. Hide item name - yes/no Show menu item in - choose to show menu item in mega menu, ...
      • DJ-MegaMenu для Jooma | Видеокурс

      • DJ-MegaMenu Joomla 4 Module options

        DJ-MegaMenu module is necessary to display the menu in the module position.  Navigate Content > Sitem modules and choose the DJ-MegaMenu module. Let's take a look at Module Parameters: Menu Name – The name of the menu (default is main menu) Base ...