I am doing the Wordpress From Scratch videos and have had good luck until Video 22. It seems my current post "Hello World" and footer "shadow" are rendering below the white background of the next three posts. I have used the "completed files" to see what I was doing wrong and I get the same issue. I have Googeled a bit but I don't think I'm using well targeted search terms for this problem. All my pictrues and everything less seems correct. I just can't get the current post to render under the title just prior to the next three posts.
Here is a copy of the php file that is (I think) the problem:
(index.php)
<?php /** * The main template file. * * This is the most generic template file in a WordPress theme * and one of the two required files for a theme (the other being style.css). * It is used to display a page when nothing more specific matches a query. * For example, it puts together the home page when no home.php file exists. * * Learn more: http://codex.wordpress.org/Template_Hierarchy * * @package WordPress * @subpackage Twenty_Twelve * @since Twenty Twelve 1.0 */ get_header(); ?> <div id="primary" class="site-content"> <div id="content" role="main"> <?php if ( have_posts() ) : ?> <?php /* Start the Loop */ ?> <?php while ( have_posts() ) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> <?php twentytwelve_content_nav( 'nav-below' ); ?> <?php else : ?> <article id="post-0" class="post no-results not-found"> <?php if ( current_user_can( 'edit_posts' ) ) : // Show a different message to a logged-in user who can add posts. ?> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'No posts to display', 'twentytwelve' ); ?></h1> </header> <div class="entry-content"> <p><?php printf( __( 'Ready to publish your first post? <a href="%s">Get started here</a>.', 'twentytwelve' ), admin_url( 'post-new.php' ) ); ?></p> </div><!-- .entry-content --> <?php else : // Show the default message to everyone else. ?> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentytwelve' ); ?></h1> </header> <div class="entry-content"> <p><?php _e( 'Apologies, but no results were found. Perhaps searching will help find a related post.', 'twentytwelve' ); ?></p> <?php get_search_form(); ?> </div><!-- .entry-content --> <?php endif; // end current_user_can() check ?> </article><!-- #post-0 --> <?php endif; // end have_posts() check ?> </div><!-- #content --> </div><!-- #primary --> <?php get_sidebar(); ?> <?php get_footer(); ?>
(this is the header.php)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="<?php bloginfo( 'charset' ); ?>" /> <title><?php wp_title( '|', true, 'right' ); ?></title> <link rel="profile" href="http://gmpg.org/xfn/11" /> <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" /> <?php wp_head(); ?> </head> <body <?php body_class(); ?> > <div id="wrapper"> <div id="col_left"> <div class="logo"> <a href="#"><img src="<?php bloginfo('template_directory');?>/images/logo.png"<?php bloginfo ('template_directory');?>/images/logo.png" alt="Killer Blog"></a> </div> <div class="links"> <h4>Categories:</h4> <ul class="categories"> <li><a href="#">Category</a></li> <li><a href="#">Category</a></li> <li><a href="#">Category</a></li> <li><a href="#">Category</a></li> <li><a href="#">Category</a></li> <li><a href="#">Category</a></li> </ul> <h4>Favorite Links:</h4> <ul class="favorites"> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> </ul> </div> <div class="social"> <h4>Get Social:</h4> <a href="#" class="facebook"><img src="<?php bloginfo('template_directory');?>/images/social-facebook.gif" alt="facebook"></a> <a href="#" class="twitter"><img src="<?php bloginfo('template_directory');?>/images/social-twitter.gif" alt="twitter"></a> </div> <img src="<?php bloginfo('template_directory');?>/images/shadow-left.png" alt=""> </div> <div id="col_right"> <div class="search"> <form action="" method=""> <div> <input name="search" type="text" value="Search" class="text" onfocus="if (this.value == 'Search') { this.value = ''; }" onblur="if (this.value == '') { this.value = 'Search'; }"> <input name="submit" type="submit" value="Submit" class="submit"> </div> </form> </div> <div class="navigation"> <ul> <li class="active"><a href="#">Home</a></li> <li><a href="#">Page</a></li> <li><a href="#">Page</a></li> <li><a href="#">Page</a></li> <li><a href="#">Page</a></li> </ul> </div> <div class="banner"> <ul> <li><img src="<?php bloginfo('template_directory');?>/images/banner1.jpg" alt=""></li> <li><img src="<?php bloginfo('template_directory');?>/images/banner2.jpg" alt=""></li> </ul> <div class="pager"> <a href="#" id="prev">Prev</a> <a href="#" id="next">Next</a> </div> </div> <div class="content"> <h1>Welcome to the Killer Blog! Read some of our recent blog posts below:</h1> <div class="post"> <div class="excerpt"> <a href="#"><img src="<?php bloginfo('template_directory');?>/images/thumb.jpg" alt=""></a> <div class="text"> <h2><a href="#">Blog Post Title</a></h2> <div class="meta">1.01.2013 | <a href="#">category</a>, <a href="#">category</a>, <a href="#">category</a></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu turpis justo, ac rutrum dui. Integer quis metus enim. Praesent id justo non purus tempor faucibus sit amet non libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia. <a href="#">read more</a></p> </div> </div> <div class="excerpt"> <a href="#"><img src="<?php bloginfo('template_directory');?>/images/thumb.jpg" alt=""></a> <div class="text"> <h2><a href="#">Blog Post Title</a></h2> <div class="meta">1.01.2013 | <a href="#">category</a>, <a href="#">category</a>, <a href="#">category</a></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu turpis justo, ac rutrum dui. Integer quis metus enim. Praesent id justo non purus tempor faucibus sit amet non libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia. <a href="#">read more</a></p> </div> </div> <div class="excerpt"> <a href="#"><img src="<?php bloginfo('template_directory');?>/images/thumb.jpg" alt=""></a> <div class="text"> <h2><a href="#">Blog Post Title</a></h2> <div class="meta">1.01.2013 | <a href="#">category</a>, <a href="#">category</a>, <a href="#">category</a></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu turpis justo, ac rutrum dui. Integer quis metus enim. Praesent id justo non purus tempor faucibus sit amet non libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia. <a href="#">read more</a></p> </div> </div> </div><!--post--> <div class="pager"> <a href="#">previous posts</a> </div> </div><!--content-->
(this is the footer.php)
<img src="<?php bloginfo ('template_directory');?>/images/shadow-right.png" alt=""> <div class="footer"> © Copyright 2013 Killer Blog </div> </div><!--col_right--> </div><!--wrapper--> <?php wp_footer(); ?> </body> </html>
