Menu bar appears twice

  • Hello,

    I was wondering if anyone can help me with this. My menu bar appears twice. I checked the element and saw the second one (now kept red so it’s distincively detectable)reads
    <div id=”page” class=”hfeed site”>…</div>

    But when I remove that whole piece in header.php the site doesn’t show anymore. So I have no idea what to change, hide or remove.

    My website:
    https://www.tim983.nl

    Thanks to anyone who can help!

Viewing 10 replies - 1 through 10 (of 10 total)

  • I only see one menu.

    Thread Starter Tim Hupkes

    (@tim983)

    Sorry, I should have said so.

    On the ipad two are visible from the start, on the computer it starts to multiply as soon as you select one menu item, wether it be ‘Contact me’ or ‘About me.’

    It looks like your primary menu is in your header.php and page.php.

    I’m only guessing, as I can’t really see those.

    Did you modify the template files at all?

    Thread Starter Tim Hupkes

    (@tim983)

    I have modified a lot… My header.php looks like this:

    <?php
/**
 * The Header for our theme
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package WordPress
 * @subpackage Twenty_Fourteen
 * @since Twenty Fourteen 1.0
 */
?><!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8) ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<meta name="viewport" content="width=device-width">
	<title><?php wp_title( '|', true, 'right' ); ?></title>
	<link rel="profile" href="https://gmpg.org/xfn/11">
	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
	<!--[if lt IE 9]>
	<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js"></script>
	<![endif]-->
	<?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
<div id="page" class="hfeed site">
	<?php if ( get_header_image() ) : ?>
	<div id="site-header">
		<a>" rel="home">
			<img src="<?php header_image(); ?>" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="">
		</a>
	</div>
	<?php endif; ?>

	<header id="masthead" class="site-header" role="banner">
        <div class="header-main">
                <h1 class="site-title"><a>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>

               <!-- Hide Search button
               <div class="search-toggle">
                        <a href="#search-container"><?php _e( 'Search', 'twentyfourteen' ); ?></a>
                </div>
                -->

                <nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
                        <h1 class="menu-toggle"><?php _e( 'Primary Menu', 'twentyfourteen' ); ?></h1>
                        <a href="#content"><?php _e( 'Skip to content', 'twentyfourteen' ); ?></a>
                        <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
                </nav>
        </div>

       <!-- Hide Search Form (optional)
       <div id="search-container" class="search-box-wrapper hide">
                <div class="search-box">
                        <?php get_search_form(); ?>
                </div>
        </div>
       -->
</header><!-- #masthead -->

			<nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
				<button class="menu-toggle"><?php _e( 'Primary Menu', 'twentyfourteen' ); ?></button>
				<a href="#content"><?php _e( 'Skip to content', 'twentyfourteen' ); ?></a>
				<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
			</nav>
		</div>

		<div id="search-container" class="search-box-wrapper hide">
			<div class="search-box">
				<?php get_search_form(); ?>
			</div>
		</div>
	</header><!-- #masthead -->

	<div id="main" class="site-main">

    My page.php is unchanged (twenty fourteen) but in style.css I have added a few things:

    /*
 Theme Name:   Twenty Fourteen Child
 Theme URI:    https://example.com/twenty-fourteen-child/
 Description:  Twenty Fourteen Child Theme
 Author:       John Doe
 Author URI:   https://example.com
 Template:     twentyfourteen
 Version:      1.0.0
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fourteen-child
*/

@import url("../twentyfourteen/style.css");

/* =Theme customization starts here
-------------------------------------------------------------- */

/* Blend Menu Bar Into Header Image
------------------------------------------------------- */

div#menu1 ul.rMenu {
background:transparent;
border-bottom:transparent;
border-top:transparent;
}

.site {
margin: 0 auto;
}

#main #secondary {
	background: url('https://www.tim983.nl/?p=44')
}

#header {
	background: url('https://www.tim983.nl/?p=44')
}

#footer {
	background: url('https://www.tim983.nl/?p=44')
}

#page,
.page-content {
	background: #aa3636;
}

div#menu1 ul.rMenu {
	background-color: rgba(255,255,255,0.65);
}

ul.rMenu li a:link, ul.rMenu li a:active,
ul.rMenu li a:visited, ul.rMenu li {
	background: transparent !important;
}

ul.rMenu li a:hover {
	background: transparent !important;
}

#page {
  background-color: transparent;
}

    Go back and compare your header with the original header. Somewhere you have added an extra navigation.

    Thread Starter Tim Hupkes

    (@tim983)

    Janet,

    thanks for your reaction.

    I put the two next to each other. The only difference seemed to be an extra <!– #masthead –>

    I threw it out to check, but it made no difference… I should look at the added code in the style.css I guess.

    What makes me wonder is the fact that the double feature only appears when you click one of the menu items. I kinda hoped this was be a fairly ‘standard’ mistake I made here. ??

    Moderator keesiemeijer

    (@keesiemeijer)

    Try removing the last primary-navigation code:

    <nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
<button class="menu-toggle"><?php _e( 'Primary Menu', 'twentyfourteen' ); ?></button>
<?php _e( 'Skip to content', 'twentyfourteen' ); ?>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
</nav>
</div>

<div id="search-container" class="search-box-wrapper hide">
<div class="search-box">
<?php get_search_form(); ?>
</div>
</div>
</header><!-- #masthead -->

    Thread Starter Tim Hupkes

    (@tim983)

    Brilliant! It works! Thanks! ??

    Moderator keesiemeijer

    (@keesiemeijer)

    You’re welcome.

    And thanks to @janet4now for working out from what file the issue originated

    Thread Starter Tim Hupkes

    (@tim983)

    I absolutely agree. Thanks, Janet! ??

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Menu bar appears twice’ is closed to new replies.