Dropdowns in Secondary Menu

  • I’m having a problem getting submenu dropdowns to appear in the Secondary Menu. I have tried using both links and existing pages as the top level menu, but the submenus do not appear on the website. The menu editing tab does allow me to create the submenus by sliding to the right. They just don’t appear in the actual page. I can hover over and click the top level menu, but the drop down does not appear. They do appear when the menu is assigned to the Primary menu, but not the Secondary or Footer menus.

    I’m using a child theme, but have tried the primary Edin theme to rule out manual changes. I’m using a social menu, and tried creating a new menu without social links and I have the same problem. This leads me to think the issue is with the Secondary Menu.

Viewing 1 replies (of 1 total)

  • Hi @joeygillis,

    Limiting the secondary menu to parent level menu items is a design decision made by the author of the Edin theme.

    It is possible to override that design choice in your child theme but the steps involved do require some knowledge of PHP and CSS.

    If you’re comfortable with that, then you will need to copy/paste the theme’s header.php file to your child theme’s directory and then make changes to the following portion:

    <nav class="secondary-navigation" role="navigation">
	<?php
		wp_nav_menu( array(
			'theme_location'  => 'secondary',
			'container_class' => 'menu-secondary',
			'menu_class'      => 'clear',
			'depth'           => 1,
		) );
	?>
</nav><!-- .secondary-navigation -->

    The depth for the secondary menu has been set to 1 and you can increase it depending on the amount of submenu items you wish to have in your menu. After you have increased the depth, CSS will be needed to be style the sub menus to your liking.

    The following would set you off on the right foot:

    .secondary-navigation ul ul {
    display: block;
    float: left;
    position: absolute;
    top: 15%;
    left: -999em;
    z-index: 99999;
    padding-top: 10px;
}

.secondary-navigation ul li:hover > ul, .secondary-navigation ul li.focus > ul {
    left: auto;
    display: block;
}

.secondary-navigation ul ul li {
    display: block;
}

    Hope that information’s helpful!

Viewing 1 replies (of 1 total)
  • The topic ‘Dropdowns in Secondary Menu’ is closed to new replies.