Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

WordPress WordPress Theme Development WordPress Header and Footer Templates Porting existing headers and footers into WordPress

Jeff Richards
Jeff Richards
818 Points

Site no longer loads after porting header and footer code.

Everything was going great up to the point where the static HTML ported into the header and footer files was updated with PHP code. As soon as I replace the css and js links with <?php wp_head(); ?> the site no longer will load, it comes up blank if I refresh or reloading produces a connection error. Completing the section with the remaining code doesn’t help. As soon as I go back to the simple header/footer content it’s fine. I’ve redone the section many times and tried very hard to make sure the code was entered correctly. What am I doing wrong?

Jeff Richards
Jeff Richards
818 Points

How can I add screen shots of the code?

Colin Marshall
Colin Marshall
32,861 Points

You can copy paste code to the forum. Watch the "Tips for asking questions" video at the link on the right sidebar.

You put three tick marks (`) (same button as the ~) in a row and put the name of the language after it (in your case php). Then paste your code on the line below and then close the code with three more tick marks on a new line.

Jeff Richards
Jeff Richards
818 Points

The page is just blank, just stalls trying to load, so it's most likely a typo that I'm just not seeing. The problem first occurs as soon as I replace the title in header.php with:

<?php wp_title(); ?>

Below is the code from funtions.php, header.php and footer.php.

functions.php
<?php

    function wpt_theme_styles () {

        wp_enqueue_style ('foundation_css', get_template_directory_uri() . '/css/foundation.css');

//      wp_enqueue_style ('normalize_css', get_template_directory_uri() . '/css/normalize.css');

        wp_enqueue_style ('googlefont_css', 'http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic');

        wp_enqueue_style ('main_css', get_template_directory_uri() . 'style.css');

    }

add_action( 'wp_enqueue_scripts', 'wpt_theme_styles');

function wpt_theme_js () {

    wp_enqueue_scripts ( 'modernizr_js',get_template_directory_uri() . '/js/modernizr.js','','', false );
    wp_enqueue_scripts ( 'foundation_js',get_template_directory_uri() . '/js/foundation.js', array('jquery'),'', true );
    wp_enqueue_scripts ( 'main_js',get_template_directory_uri() . '/js/app.js', array('jquery', 'foundation_js'),'', true );

}


add_action( 'wp_enqueue_scripts', 'wpt_theme_js');
header.php
<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><?php wp_title(); ?></title>
    <?php wp_head(); ?>
  </head>

  <body>
    <header class="row no-max pad main">
  <h1><a class="current" href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
  <a href="" class="nav-toggle"><span></span>Menu</a>
  <nav>
    <h1 class="open"><a class="current" href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
    <ul class="no-bullet">
      <li class="current parent"><a class='current' href="index.html">Portfolio</a>
        <ul class="sub-menu">
          <li><a href="item.html">Portfolio Item</a></li>
          <li><a href="item.html">Portfolio Item</a></li>
          <li><a href="item.html">Portfolio Item</a></li>
          <li><a href="item.html">Portfolio Item</a></li>
        </ul>
      </li>
      <li class="parent"><a href="blog.html">Blog</a>
        <ul class="sub-menu">
          <li><a href="single-post.html">Single Post</a></li>
          <li><a href="author.html">Author Page</a></li>
        </ul>
      </li>
      <li><a href="about.html">About</a></li>
      <li><a href="contact.html">Contact</a></li>
    </ul>
  </nav>
</header>
footer.php
    <div class="footer-clear"></div>
<footer class="row no-max pad">

  <p>Copyright <?php echo date('Y') ?></p>
</footer>

<?php wp_footer(); ?>

  </body>
</html>
Jeff Richards
Jeff Richards
818 Points

Found the error. It was in the functions.php file. I had wp_enqueue_scripts rather than wp_enqueue_script.

Trying to keep a clear head and "see" these errors can be really hard for a beginner, since everything is done by emulating and no real experience.

That guys for taking a look!

5 Answers

Jeff Richards
Jeff Richards
818 Points

Found the error. It was in the functions.php file. I had wp_enqueue_scripts rather than wp_enqueue_script.

Colin Marshall
Colin Marshall
32,861 Points

Nice! Great job finding the error.

Marko Rapaic
Marko Rapaic
13,871 Points

Thanks Jeff, I had the same error.

Mathieu HAYS
Mathieu HAYS
9,623 Points

If your page is just displayed without any style, it might just mean that your call for the stylesheet is not correct. When you create a theme in wordpress you have to put the files in your theme folder. To retrieve the url of your theme folder you have to do:

<?php echo get_template_directory_uri(); ?>/css/main.css

In that case your css file would be in {root of your website}/wp-content/themes/your-theme/css/main.css

If nothing is displayed on page (just blank), you might have a typo in your php.

If this is not fixing your issue, please post your code here ;)

Mathieu HAYS
Mathieu HAYS
9,623 Points

Not sure if the treehouse forum or you code but your footer code is broken.

<div class="footer-clear"></div>
<footer class="row no-max pad">

  <p>Copyright <?php echo date('Y'); ?></p>
</footer>

<?php wp_footer(); ?>

  </body>
</html>

And a little advice as well. When possible don't close the php tag at the end of your php files (especially functions.php). If you leave a space after that final closing tag it can produce a blank page as well. Because if you generate content (space is content) before WordPress managed to send the headers, it will break.

If you are stuck while developping, enabling WP_DEBUG can help.

Look for this constant in your wp-config.php. If not there you can add:

define('WP_DEBUG', true);
Jeff Richards
Jeff Richards
818 Points

Good advice regarding not closing the php tag. I still get confused on this. I don't understand why sometimes you can leave it off, when the core syntax of the language indicates it should be there. I removed it from functions.php but it did not help in this case.

The footer.php code is what I typed in directly from the tutorial, do you know what is broken or what is supposed to be there? I did edit my reply so maybe it's fixed now, not sure what is wrong or what to look for.

When I remove all the code in the header file and replace it with the original simple p tag the site loads fine, but with no header content. I also set WP_DEBUG to true and no errors are showing up.

Colin Marshall
Colin Marshall
32,861 Points

One error I see is that you are missing a left angle bracket before the first php statement in your second h1 in header.php.

Jeff Richards
Jeff Richards
818 Points

Thanks Collin, the single quote around some of the classes is what was in the tutorial. I wonder if Zac realizes that, or if there are other errors? I did change them to double quotes.

I'm not following you on the missing left angle bracket. Are you talking about the code in the title tag?

<title><?php wp_title(); ?></title>

I'm working with a local WordPress install via Desktop Server and trying to follow along with the course step by step. I wish they had work files for each stage.

Colin Marshall
Colin Marshall
32,861 Points

No I'm talking about the code in your 2nd h1 tag. This line:

<h1 class="open"><a class="current" href="?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>

Should be:

<h1 class="open"><a class="current" href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
Colin Marshall
Colin Marshall
32,861 Points

I guess the single quotes around the class are ok. I never saw it before and I just looked it up and it is common and acceptable.

Jeff Richards
Jeff Richards
818 Points

Fixed the error in header.php but still no luck. I updated the code posted above. This is getting frustrating.

Colin Marshall
Colin Marshall
32,861 Points

Not sure if this will fix the problem, but here's another issue with your code.

There should be spaces after the commas that separate each function parameter. You have:

<?php
function wpt_theme_js () {

    wp_enqueue_scripts ( 'modernizr_js',get_template_directory_uri() . '/js/modernizr.js','','', false );
    wp_enqueue_scripts ( 'foundation_js',get_template_directory_uri() . '/js/foundation.js', array('jquery'),'', true );
    wp_enqueue_scripts ( 'main_js',get_template_directory_uri() . '/js/app.js', array('jquery', 'foundation_js'),'', true );

}

You need a space after every comma. It should be:

<?php
function wpt_theme_js () {

    wp_enqueue_scripts ( 'modernizr_js', get_template_directory_uri() . '/js/modernizr.js', '', '', false );
    wp_enqueue_scripts ( 'foundation_js', get_template_directory_uri() . '/js/foundation.js', array('jquery'), '', true );
    wp_enqueue_scripts ( 'main_js', get_template_directory_uri() . '/js/app.js', array('jquery', 'foundation_js'), '', true );

}

Disregard the php tags in this post, I had to add them so that the code would be highlighted on the forum.

Colin Marshall
Colin Marshall
32,861 Points

If adding spaces after the commas still fails, do a view source on the blank page that comes up when you try to load it and copy paste the source html to here.

Mathieu HAYS
Mathieu HAYS
9,623 Points

In PHP, it doesn't change anything to add a space after the comma or not.

It's great to stick to some code standards for readability though but it won't make your php script fail.