Simple question and hopefully, it'll call for an easy answer.
Why does my post's first page found here:
http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/
Which looks fine by the way, looks different that the subsequent pages within the post?
http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/2/
http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/3/
http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/4/
http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/5/
All of the subsequent pages look broken despite using the same .css file as the first page.
And when I say broken, just take a look at the sidebar when compared to the first page.
This is my first multi-paged post, which one of my writers put up, and post launched 2 hours ago and it's already have 500 views to this post already. I need some help.
Thanks
Chuck Mac answers:
The sidebar is broken on the subsequent pages because the "post" div is not closed before the sidebar is called.
On your first page:
<div id="title"></div>
<div class="post">
<div class="post" id="post-10087"></div>
<div class="clear"></div>
<div id="disqus_thread"></div>
</div>
<div id="sidebar"></div>
On the subseqent pages:
<div id="title"></div>
<div class="post">
<div class="post" id="post-10087">
...
<div class="clear"></div>
<div id="disqus_thread"></div>
</div>
<div id="sidebar"></div>
</div>
If you can post your single.php I might be able to debug it more fully.
<em>EDIT:</em>
That should fix your immediate issue of the sidebar, but it also looks like you have a lot of issues with the code even on the "working" page. [[LINK href="http://validator.w3.org/check?uri=http://theurbantwist.com/entertainment/2011/02/11/valentines-day-edition-what-men-really-think/&charset=(detect+automatically)&doctype=Inline&group=0&user-agent=W3C_Validator/1.1"]]WC3 validator shows[[/LINK]] 114 errors and 47 warnings.
<em>EDIT 2:</em>
With your single.php and looking at this a little more, I now believe you have the extra opening <div> tag in your post body in the database.
<div>
<h2 style="text-align: left;">We always hear that men prefer brains over beauty, how true or false is this statement?</h2>
This is coming from the_content which calls from the post itself. Try to edit the post and switch to html mode in TinyMCE. Do you see this div tag there above that line? If so, remove it.
Brennen Jones comments:
Yeah, I'm aware of the validator problem...It seems that everytime a change is made that the errors go up...one day I will have to sit down and take the time out to sort through my theme and validate everything.
Here's the code for my single.php file.
<?php get_header(); ?>
<div id="topLeaderboard">
<?php advman_ad('Leader'); ?>
</div>
<?php include('featured_posts_slideshow.php') ?> <!--Adds Featured Posts -->
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php if(in_category ('from-the-bottom-up-fernando-quijano')) {?>
<div class="col-banner">
<img src="http://theurbantwist.com/online/wp-content/themes/yamidoo/images/the-word-pimp.jpg">
</div>
<?php }?>
<?php if(in_category ('the-most-hated-list-bryan-stewart')) {?>
<div class="col-banner">
<img src="http://theurbantwist.com/online/wp-content/themes/yamidoo/images/the-most-hated.png">
</div>
<?php }?>
<?php if(in_category ('the-speaker-box')) {?>
<div class="col-banner">
<img src="http://theurbantwist.com/online/wp-content/themes/yamidoo/images/the-speaker-box.png">
</div>
<?php }?>
<div id="title"><?php breadcrumbs_plus( $args ); ?>
<h1><?php the_title(); ?></h1>
</div>
<div class="post">
<div class="post" id="post-<?php the_ID(); ?>">
<small><?php echo get_avatar( get_the_author_id() , 35 ); ?> By <?php the_author_posts_link(); ?> on <?php the_time('F j, Y') ?> at <?php the_time() ?> | <?php comments_popup_link('No comments yet', '1 comment so far',
'% comments so far (is that a lot?)', 'comments-link', 'Comments are
off for this post'); ?> <?php edit_post_link( __('Edit'), ' | ', ''); ?>
</small><br />
<div style="clear:both;"></div>
<div id="socialicons">
<div style="float:left;padding-right:5px;"><?php if (function_exists('fbshare_manual')) echo fbshare_manual(); ?></div>
<div style="float:left;padding-right:5px;"><a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="theurbantwist">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>
<div style="float:left;padding-right:5px;margin-left:-15px;"><script src="http://www.stumbleupon.com/hostedbadge.php?s=1"></script></div>
<script type="text/javascript">
(function() {
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script>
<!-- Compact Button -->
<a class="DiggThisButton DiggCompact"></a>
</div>
<div style="clear:both;"></div>
<!-- surphace start -->
<div class='pagenavi pagenavi-top'><?php TA_content_jump(1); ?></div>
<?php the_content('<p>Read the rest of this entry »</p>'); ?>
<div class='pagenavi pagenavi-top'><?php TA_content_jump(1); ?></div>
<!-- surphace end -->
<div id="social-headlines">
<h7>Get The Urban Twist on
<a href="http://facebook.com/theurbantwist" target="_blank">Facebook</a> and
<a href="http://twitter.com/theurbantwist" target="_blank">Twitter</a>!</h7>
<br><br><h7>Don't Forget to Sign Up For
Our Brand New <a href="http://theurbantwist.com/newsletter/" target="_blank">Newsletter</a>!</h7>
</div>
<div id="like-story">
<h1>Do You Like This Story?</h1>
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&layout=standard&show_faces=false&width=450&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; margin-top:-10px; width:450px; height:30px;"></iframe>
</div>
<div id="outbrain"></div>
<div id="ad-story">
<?php advman_ad('Sidebar Top'); ?>
</div>
<div style="clear:both;"></div>
<small><?php the_tags( __( '<span class="tag-links">Tags: ', 'wpbx' ), ", ", "</span>\n" ) ?></small>
<div class="clear"></div>
</div>
<div class="clear"></div>
<?php comments_template(); ?>
<?php endwhile; else: ?>
<p>Sorry, no posts matched your criteria.</p>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Thanks
Brennen Jones comments:
That did the trick! Thanks a lot. I'll have to watch what my writers do more carefully. I didn't write the post, so I don't know how that happened.
Sébastien | French WordpressDesigner answers:
In the code of the homepage you have : 252 <div> but 243 </div>
in your page 2 you have 253 <div> but 243 </div>
I think if you closed all your div the problem will be resolved :-)
Sébastien | French WordpressDesigner comments:
@Chuck > <blockquote>the "post" div is not closed</blockquote>
10 div are not closed on the subsequent pages :-)
Vidyut Kale answers:
Without seeing your code, it is difficult to say, but from the look of it, your post template is fine or your other pages would be broken. Simply adding a closing </div>
will kill the layout on other pages.
It is essentially some difference in the code from the main post page to the other pages. Your pagination looks like the most likely culprit.
A quick way of seeing if that is the problem would be disabling the plugin and reloading the page to see if it works or trying with a different pagination plugin. If the problem is there, we look at other things, otherwise, you're sorted.
If it is indeed the pagination that is the problem, you can change the plugin you use, or you can get someone to fix the code for you. You will likely catch the missing closing <div> yourself, if that turns out to be the issue.
If your pagination is built into your theme, unhook it to test (more complicated to explain), but it can wait.
If the page navigation isn't the problem, try disabling the ads and other widgets below the post and see if that fixes it.
We are basically looking for a starting point to examine code.
Brennen Jones comments:
Thanks for your response...it looks like the writer of this article threw some <div> tags in their article and that's what threw everything out of wack as Chuck explained to me above.