Home / Help / Tutorials, Guides & FAQs / DJ-MegaMenu FAQ / How to upgrade a mobile theme for DJ-MegaMenu 3.7?
Friday, 15 June 2018 10:42
Modified: Friday, 15 June 2018 13:30
How to upgrade a mobile theme for DJ-MegaMenu 3.7? 3.0 out of 5 based on 2 votes.

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;

Found this article interesting? Subscribe for more.
Or share this article with your friends.

Subscribe to the Telegram bot / Subscribe to the Messenger Bot
User Rating:  (2)