WordPress WordPress Theme Development Building Out WordPress Navigation The wp_nav_menu Function

nav button not loading

when i click the nav button at the top right like in the video i get this: Failed to load resource: the server responded with a status of 404 (Not Found) icon-youtube.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-octocat.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-linkedin.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-email.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-flickr.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-twitter.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-vimeo.png:1 Failed to load resource: the server responded with a status of 404 (Not Found) icon-facebook.png:1 Failed to load resource: the server responded with a status of 404 (Not Found)

Wiktor Bednarz
Wiktor Bednarz
18,632 Points

Hey there,

it seems like the errors that your browser is catching are related to the fact that you're trying to use non-existing assets. The only place those assets are called is in the footer of the static page, so I guess that your footer.php in your theme folder looks something like that:

<div class="footer-clear"></div>
<footer class="row no-max pad">
  <p>Copyright <?php echo date('Y'); ?></p>
  <ul class="social-links no-bullet">
    <li><a href="" class="icon icon-twitter"></a></li>
    <li><a href="" class="icon icon-facebook"></a></li>
    <li><a href="" class="icon icon-vimeo"></a></li>
    <li><a href="" class="icon icon-youtube"></a></li>
    <li><a href="" class="icon icon-linkedin"></a></li>
    <li><a href="" class="icon icon-github"></a></li>
    <li><a href="" class="icon icon-flickr"></a></li>
    <li><a href="" class="icon icon-google"></a></li>
    <li><a href="" class="icon icon-email"></a></li>
  </ul>            
</footer>

  <?php wp_footer(); ?>

  </body>
</html>

So in other words the errors you've provided are not related to the nav button, but to the footer trying to call in on non-existing assets. Delete the whole <ul> element from your footer.php and the errors should disappear.

<div class="footer-clear"></div>
<footer class="row no-max pad">
  <p>Copyright <?php echo date('Y'); ?></p>       
</footer>

  <?php wp_footer(); ?>

  </body>
</html>

3 Answers

Wiktor Bednarz
Wiktor Bednarz
18,632 Points

As for an answer, the problem with navigation might be due to some errors with your functions.php file. I'd suggest going through all of the script calling functions there and double-check if they're correct. Your functions.php file should look something like that:

<?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( "google_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_script( "modernizr_js", get_template_directory_uri() . "/js/modernizr.js", "", "", false);
  wp_enqueue_script( "foundation_min_js", get_template_directory_uri() . "/js/foundation.min.js", array("jquery"), "", true);
  wp_enqueue_script( "main_js", get_template_directory_uri() . "/js/app.js", array("jquery", "foundation_min_js"), "", true);
}
add_action( "wp_enqueue_scripts", "wpt_theme_js");

?>

If this won't solve the problem, then try checking if you've copied the right .js files from the static site folder provided at the start of the course.

thanks you were right and it loads now. idk why when i view my page i get a notice under the wordpress admin bar saying class="home page-template-default page page-id-9 logged-in admin-bar no-customize-support"

and just fixed what that was...i didnt put the php IN the body tag like so <body <?php body_class(); ?>> i instead put like this <body> then php