WordPress.org

Ready to get started?Download WordPress

Forums

nav menu and header remains scrolling down site (9 posts)

  1. yont5983
    Member
    Posted 3 months ago #

    To whom it may concern,
    I would like to have my nav menu and main header remain fixed or static while visitors scroll down the site just like how the 2014 Theme operates. Here is the website: reneenahum.com
    If any more information is needed please let me know. I have already created the child theme for Anaximander-Static.

  2. Andrew
    Forum Moderator
    Posted 3 months ago #

    Not sure where you got that theme from, but have you seen how 2014 does it? It uses "fixed" position.
    https://developer.mozilla.org/en-US/docs/Web/CSS/position#Fixed_positioning

  3. yont5983
    Member
    Posted 3 months ago #

    I have tried position: fixed; and top: 0; What 2014 does is it allows the posts or page information to scroll into or under the main nav menu and the main nav menu remains in the same position while the visitor scrolls up and down. Is there something I would need to change with the header.php and style.css in the child theme? Thank you very much for your help. Here is the website again: reneenahum If any more information is needed please do not hesitate to ask.

  4. Andrew
    Forum Moderator
    Posted 3 months ago #

    First you have your nav menu outside of your header, try moving it inside <header>

  5. yont5983
    Member
    Posted 3 months ago #

    I believe the nav menu is within the <header> section. In the header.php file.
    Here is the code for the header.php document:

    <header id="site-header" class="group" role="banner">

    <?php
    // Get header image:
    $header_image = get_header_image();
    // Get text colour (or lack thereof):
    $text_color = get_header_textcolor();
    ?>

    <?php
    // Has the text been hidden?
    if ( 'blank' == $text_color ) { echo '<div id="header_image_margin">'; }
    else { echo '<div id="header_margin">'; }
    ?>
    <div class="header-container group">

    <hgroup id="header-title" <?php /* if ( $header_image ) { echo 'class="header-image-true"'; } */ ?>>
    <h1 id="site-title">" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></h1>
    <h2 id="site-description"><?php bloginfo( 'description' ); ?></h2>
    </hgroup>

    </div><!-- .header-container -->
    </div><!-- #header_margin or #header_image_margin -->

    <?php
    // Check to see if there is a custom header image

    if ( $header_image) :
    echo '<div id="header_image">';

    // Compatibility with versions of WordPress prior to 3.4.
    if ( function_exists( 'get_custom_header' ) ) {
    // We need to figure out what the minimum width should be for our featured image.
    // This result would be the suggested width if the theme were to implement flexible widths.
    $header_image_width = get_theme_support( 'custom-header', 'width' );
    } else {
    $header_image_width = HEADER_IMAGE_WIDTH;
    }
    ?>
    " title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
    <?php
    // The header image
    // Compatibility with versions of WordPress prior to 3.4.
    if ( function_exists( 'get_custom_header' ) ) {
    $header_image_width = get_custom_header()->width;
    $header_image_height = get_custom_header()->height;
    } else {
    $header_image_width = HEADER_IMAGE_WIDTH;
    $header_image_height = HEADER_IMAGE_HEIGHT;
    }
    ?>

    <img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />

    <nav id="sub-access" class="group" role="navigation">

    <h1 class="assistive-text section-heading"><?php _e( 'Main menu', 'anaximander' ); ?></h1>
    <div class="skip-link screen-reader-text">"><?php _e( 'Skip to content', 'anaximander' ); ?></div>

    <?php
    wp_nav_menu( array( 'theme_location' => 'header_menu', 'menu_class' => 'nav-menu' ) );
    ?>

    </div>
    <?php endif; // end check for removed hea

  6. yont5983
    Member
    Posted 3 months ago #

    The previous code is for the child theme header.php not the main theme header.php

  7. Andrew
    Forum Moderator
    Posted 3 months ago #

    I can't read that jubmled code, but it looks like your HTML isn't valid to start with http://validator.w3.org/check?uri=http%3A%2F%2Freneenahum.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

  8. yont5983
    Member
    Posted 3 months ago #

    How would you like me to display the code? Should I just keep sending the link reneenahum.com or just a small section of the html? Please let me know so I get some help with my problem.

  9. yont5983
    Member
    Posted 3 months ago #

    To whom it may concern,
    I think the issue lies in header.php. I just need to know if I am looking in the right direction. It seems like the only difference is that the 2014 theme has the nav bar in ul lists.

Reply

You must log in to post.

About this Topic