Joomla 3.9 Child Sub Menu Not Showing

Question

I am using a custom Joomla template called 'Portent' built by Joomlanauts -- a @SethWarburton creation.

The issue which I am facing is that the Sub-menu under my Child menu items are not showing for some reason.

How can I show the child submenu?

1) Here I have sub-menu:

2) Here is what I have on my Joomla Menu setup:

3) Under Joomla module 'Menu' I have selected to show 'Sub-menu':

4) Under the "html/mod_menu/bs-dropdown.php" in template "portent"."

<?php
/**
 * @package     Joomla.Site
 * @subpackage  mod_menu
 *
 * @copyright   Copyright (C) 2005 - 2014 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;

// Note. It is important to remove spaces between elements.
?>
<?php // The menu class is deprecated. Use nav instead. ?>
<ul class="nav <?php echo $class_sfx;?>"<?php
    $tag = '';

    if ($params->get('tag_id') != null)
    {
        $tag = $params->get('tag_id') . '';
        echo ' id="' . $tag . '"';
    }
?>>
<?php
foreach ($list as $i => &$item)
{
    $class = 'item-' . $item->id;

    if ($item->id == $active_id)
    {
        $class .= ' current';
    }

    if (in_array($item->id, $path))
    {
        $class .= ' active';
    }
    elseif ($item->type == 'alias')
    {
        $aliasToId = $item->params->get('aliasoptions');

        if (count($path) > 0 && $aliasToId == $path[count($path) - 1])
        {
            $class .= ' active';
        }
        elseif (in_array($aliasToId, $path))
        {
            $class .= ' alias-parent-active';
        }
    }

    if ($item->type == 'separator')
    {
        $class .= ' divider';
    }

    if ($item->type == 'heading')
    {
        $class .= ' muted';
    }

    if ($item->deeper)
    {
        $class .= ' dropdown nav-stacked';
    }

    if ($item->parent)
    {
        $class .= ' parent';
    }

    if (!empty($class))
    {
        $class = ' class="' . trim($class) . '"';
    }

    echo '<li' . $class . '>';

    // Render the menu item.
    switch ($item->type) :
        case 'separator':
        case 'url':
        case 'component':
        case 'heading':
            require JModuleHelper::getLayoutPath('mod_menu', 'default_' . $item->type);
            break;

        default:
            require JModuleHelper::getLayoutPath('mod_menu', 'default_url');
            break;
    endswitch;

    // The next item is deeper.
    if ($item->deeper)
    {
        echo '<ul class="dropdown-menu">';
    }
    elseif ($item->shallower)
    {
        // The next item is shallower.
        echo '</li>';
        echo str_repeat('</ul></li>', $item->level_diff);
    }
    else
    {
        // The next item is on the same level.
        echo '</li>';
    }
}
?></ul>

---

@grant-g this is what I get under inspect element :(

@SethWarburton any advise on this?

Answer 1

Untested, but I think you ought to change:

    if ($item->deeper)
    {
        $class .= ' dropdown nav-stacked';
    }

To something like this:

    if ($item->deeper) {
        if ($item->level > 1){
            $class .= ' dropdown-submenu';
        } else {
            $class .= ' deeper dropdown';
        }
    }

You may want to use Chrome Dev Tools inspect, to identify the desired submenu dropdown, and add the appropriate class. The classes above are Bootstrap 3 classes. I also think your mod_menu template has been modified for your template, so you might want to look at putting nav-stacked class in parent nav element, so <ul class="nav nav-stacked>