vape bees
vape bees

Reputation: 3

wordpress get_header() on a page template getting the head content inside of the body tag

I am having trouble with my Wordpress template page. When calling get_header() in the template page, the content of the head is appearing inside the body tag and causing trouble. I couldn't find a solution for this.

This is what I mean :

page inspect element

page template :

<?php
  /*
  * Template Name: sub services
  */

  get_header();
?>

<h1>sub page</h1>

<?php
    get_footer();
?>

header.php :

<!DOCTYPE html>
<html <?php language_attributes(); ?>>

<head>
 <meta charset="<?php bloginfo('charset'); ?>">
 <?php wp_title();?>
 <link rel="icon" type="image/png" href="/favicon.png">
 <link href="https://fonts.googleapis.com/css2?family=Lemonada:wght@600&display=swap" rel="stylesheet">
 <script src="https://kit.fontawesome.com/90928eb6b7.js" crossorigin="anonymous"></script>
 <?php wp_head(); ?>
</head>

<body id="theme-body" <?php body_class(); ?>>
  <header>
     <h1>Main Header</h1>
  </header>

and I have added a page in wordpress admin and linked it to the template.

wordpress add page

Everything works fine except that the content of the head is in the body tag. when calling get_header(). In the template.php I have checked my error log and its fine. I dont know what is causing this problem or what I'm doing something wrong.

Upvotes: 0

Views: 2196

Answers (1)

Johannes
Johannes

Reputation: 67748

Your header.php file contains the full body (including the closing </body>) and even the closing </html> tag. Your page template then appends to that some more HTML and a footer - that's invalid HTML and can't really be intended, is it?

Browser will probably try to fix those errors by adding missing or omitting superfluous tags, but in this case none of that will come up with the intended result - it will rather lead to a result like the one you are seeing.

The header.php file can contain the opening <body> tag, but not the closing </body>. But it should contain the Wordpress loop, and inside that the_content() to load the actual page content, and also the other WP functions to fetch heading, featured image etc.

After that, you usually fetch the footer using get_footer();, which might contain the closing </body> tag, if that's not in the page template.

So, the biggest problem in your code are the closing </body> and </html> tags and the resulting invalid HTML.

Upvotes: 3

Related Questions