theme development - Wordpress displaying two different headers, one at top and one below footer-软件玩家

admin管理员组
文章数量:1414628

I am building a custom WP theme for the first time. Just started trying to put specific header template files with my different page templates. For some reason, when I use "get_header(X)" to call a specific header template, the page in the browser displays the correct header at the top, but then replicates the main header (from header.php) at the end of the page, below the footer.

I can't see where in the code this is being called from, but when I look at the source in browser, it is clear to see the full contents of header.php inserted below the footer. Have included the code from my "page-eyfs.php" template, which calls the 'eyfs' header template at the start.

Site is only local currently

    <?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* @link 
*
* @package thatnurserylife
*/

?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="">

<?php wp_head(); ?>

<!Adding Google Fonts into Header so that they will apply on all pages. Will call the fonts directly from style.css!>

<style>
    @import url('|Questrial&display=swap');

    .headertitle{
    margin: auto;
    font-family: 'Mali', cursive;
    font-size: 3vw;

    }

    .headertitlebold{
    font-weight: bold;
    }

    .headerboxes{
    overflow: hidden;
    width: 100%;
    }

    .headerboxesside{
    float: left;
    width: 25%;
    padding-bottom: 500em;
    margin-bottom: -500em;

    }

    .headerboxesmid{
    float: left;
    width: 50%;
    display: flex;
    margin: auto;
    padding-bottom: 500em;
    margin-bottom: -500em;
    min-width: 500px;

    }

    .headerlogo{
    height: 15em;
    width: auto;
    margin: auto;
    float: left;
    position: relative;
    padding: 0 0 0 0;
    }

.clearfix::after {
content: "";
clear: both;
display: table;
}
</style>

</head>

<body <?php body_class(); ?>>


<div id="page" class="site">
<a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'thatnurserylife' ); ?></a>

    <header>   
     <div class="headerboxes">
        <div class="headerboxesside" style="background-color:#fff">
            <p>     </p>
        </div>

        <div class="headerboxesmid" style="background-color:#fff">

            <img class="headerlogo" src="/wp-content/uploads/logo.png" alt="Should be a logo here!" /> 
            <div class="headertitle">
            <h> all you need to love <br><strong>thatnurserylife</strong></h>
            </div>
        </div>

        <div class="headerboxesside" style="background-color:#fff">
            <p>  </p>
        </div>

     </div>

        <!-- .site-branding -->



            </div>


    <nav id="site-navigation" class="main-navigation">
        <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( 'Primary Menu', 'thatnurserylife' ); ?></button>
        <?php
        wp_nav_menu( array(
            'theme_location' => 'menu-1',
            'menu_id'        => 'primary-menu',
        ) );
        ?>
    </nav><!-- #site-navigation -->
</header>   <!-- #masthead -->

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

^This is the code for the main/homepage header, which appears correctly^

<?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* @link 
*
* @package thatnurserylife
*/

?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="">

<?php wp_head(); ?>

<!Adding Google Fonts into Header so that they will apply on all pages. Will call the fonts directly from style.css!>

<style>
    @import url('|Questrial&display=swap');

    .headertitle{
    margin: auto;
    font-family: 'Mali', cursive;
    text-align: left;
    font-size: 4em;

    }

    .headertitlebold{
    font-weight: bold;
    }

    .headerboxes{
    overflow: hidden;
    width: 100%;
    }

    .headerboxesside{
    float: left;
    width: 25%;
    padding-bottom: 500em;
    margin-bottom: -500em;

    }

    .headerboxesmid{
    float: left;
    width: 50%;
    display: flex;
    margin: auto;
    padding-bottom: 500em;
    margin-bottom: -500em;

    }

    .headerlogo{
    height: 15em;
    width: auto;
    margin: auto;
    float: left;
    position: relative;
    padding: 0 0 0 0;
    }

.clearfix::after {
content: "";
clear: both;
 display: table;
}
</style>

</head>

<body <?php body_class(); ?>>


<div id="page" class="site">
<a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'thatnurserylife' ); ?></a>

    <header>   
     <div class="headerboxes">
        <div class="headerboxesside" style="background-color:#fff">
            <p>     </p>
        </div>

        <div class="headerboxesmid" style="background-color:#fff">

            <img class="headerlogo" src="/wp-content/uploads/EYFS_logo.png" alt="Should be EYFS logo here!" /> 
            <div class="headertitle">
            <h> EYFS Activity Plans</h>
            </div>
        </div>

        <div class="headerboxesside" style="background-color:#fff">
            <p>  </p>
        </div>

     </div>

        <!-- .site-branding -->



            </div>


    <nav id="site-navigation" class="main-navigation">
        <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( 'Primary Menu', 'thatnurserylife' ); ?></button>
        <?php
        wp_nav_menu( array(
            'theme_location' => 'menu-1',
            'menu_id'        => 'primary-menu',
        ) );
        ?>
    </nav><!-- #site-navigation -->
</header>   <!-- #masthead -->

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

^This is the code for the alternative header which is displaying correctly at the top, with the main header incorrectly displayed beneath the footer^

    <?php /* Template Name: EYFS type */ ?>
<?php
/**
* 
* The template for displaying all pages
*
* This is the template that displays all pages by default.
* Please note that this is the WordPress construct of pages
* and that other 'pages' on your WordPress site may use a
* different template.
*
* @link /
 *
* @package thatnurserylife
*/

get_header('eyfs');


?>

<div>
    <h2>This is an EYFS type page</h2>
</div>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

    <?php
    while ( have_posts() ) :
        the_post();

        get_template_part( 'template-parts/content', 'page' );

        // If comments are open or we have at least one comment, load up the comment template.
        if ( comments_open() || get_comments_number() ) :
            comments_template();
        endif;

    endwhile; // End of the loop.
    ?>

    </main><!-- #main -->
</div><!-- #primary -->

<?php
get_sidebar();
get_footer();

^This is the code from the EYFS page template^

本文标签： theme developmentWordpress displaying two different headers one at top and one below footer

版权声明：本文标题：theme development - Wordpress displaying two different headers, one at top and one below footer 内容由网友自发贡献，该文观点仅代表作者本人，转载请联系作者并注明出处：http://www.betaflare.com/web/1745190672a2646895.html，本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。

编程频道|软件玩家 - 软件改变生活！

theme development - Wordpress displaying two different headers, one at top and one below footer

更多相关文章