I've been working for several days to figure out how the mobile menu operates. I attempted to assign modules with the off-canvas position to various menus, but nothing seems to work.
While examining the default.php, I found the following lines:
<div id="gkMobileMenu"<?php if($this->API->get('menu_type', 'off-canvas') === 'off-canvas') : ?> class="off-canvas"<?php endif; ?>>
<span id="static-aside-menu-toggler" class="fas fa-bars"><span class="element-invisible">static-aside-menu-toggler</span></span>
</div>
<?php if($this->API->get('menu_type', 'off-canvas') === 'off-canvas') : ?>
<i id="close-menu">×</i>
<nav id="aside-menu">
<div>
<?php if($this->API->modules('menu_top')) : ?>
<div id="gk-menu-top">
<jdoc:include type="modules" name="menu_top" style="none" />
</div>
<?php endif; ?>
<?php
$this->asidemenu->loadMenu($this->API->get('menu_name','mainmenu'));
$this->asidemenu->genMenu($this->API->get('startlevel', 0), $this->API->get('endlevel',-1));
?>
<?php if($this->API->modules('menu_bottom')) : ?>
<div id="gk-menu-bottom">
<jdoc:include type="modules" name="menu_bottom" style="none" />
</div>
<?php endif; ?>
</div>
</nav>
<?php endif; ?>
From what I can tell, this seems to be the code handling the mobile menu. When I inspect the HTML, I see:
<nav id="aside-menu" class="menu-open">
<div class="aside-menu-inner">
<div class="aside-menu-wrap">
<div class="gkAsideMenu">
<ul class="gkmenu level0">
<li class="first"><a href="http://mysite.com/ class="first">Home</a></li>
</ul>
</div>
<div class="gkAsideMenu">
<ul class="gkmenu level0">
<li class="first"><a href="http://mysite.com/" class="first">Home</a></li>
</ul>
</div>
</div>
</div>
</nav>
Currently, only "Home" appears as a menu item. How can I get the mobile menu to display the same items as the desktop version? Any advice would be greatly appreciated.
Thanks!