Repost: Inserting a 'clearing div' after every 3rd post. WordPress
- SOLVED
This is a repost of a question I asked a short time ago that I already paid for, but should have checked results first.
[[LINK href="http://wpquestions.com/question/show/id/1059"]]http://wpquestions.com/question/show/id/1059[[/LINK]]
I tried every solution and while some 'seemed' to work, it turns out that none of them work. The problem is that instead of showing post 1-3 then div then 4-6 then div then 7-9 etc...
they are actually skipping the 4th, 7th, and 10th posts respectively. The code I am currently using seems to replace the 4th article with the clearing div, instead of inserting the div in between 3 and 4.
example:
[[LINK href="http://shawn.theanointedone.com/photogalleries/"]]http://shawn.theanointedone.com/photogalleries/[[/LINK]]
Notice there is no tiltshift gallery #3, or #7 displayed even though they exist and should display.
Here is the code I am currently using. The mistake will probably become instantly apparent to most coders.
<div id="archive">
<ul class="posts posts-3 grid">
<?php woo_loop_before(); ?>
<?php if (have_posts()) : $count = 0; ?>
<?php while (have_posts()) : the_post(); $count++; ?>
<!-- Post Starts -->
<?php woo_post_before(); ?>
<?php if ( 0 ==$count%4 ) { ?>
<li class="cleaner"> </li>
<?php } else { ?>
<li>
<div class="cover-image">
<a href="<?php the_permalink() ?>">
<?php woo_image('width=218&height=150&class=photofade&single=true&link=img'); ?>
</a>
</div><!-- /.cover-image -->
<div class="postcontent">
<h2 class="title">
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a>
</h2>
<p class="hidden"><?php the_time('F jS, Y') ?> | <?php the_category(', ') ?></p>
<p>
<?php ob_start();
the_excerpt('Read the full post',true);
$postOutput = preg_replace('/<img[^>]+./','', ob_get_contents());
ob_end_clean();
$excerpt_length = "40";
echo woo_text_trim( $postOutput, $excerpt_length); ?>
</p>
<p class="hidden separator"></p>
<p class="showme"><?php the_time('F jS') ?> | <?php the_category(', ') ?></p>
</div><!-- /.postcontent -->
<p class="hidden separator"></p>
</li>
<?php } ?>
<?php woo_post_after(); ?>
<?php endwhile; else: ?>
<div class="post">
<p><?php _e('Sorry, no posts matched your criteria.', 'woothemes') ?></p>
</div><!-- /.post -->
<?php endif; ?>
</ul>
</div><!-- /.archive -->
I've also noticed that the way I am doing it is really screwing with the wp post count etc. Meaning I go to the reading settings page and say show 6, well only 5 show up because of my screwy code.
I need a snippet in here that will basically 'insert' a 'cleaner' li between the posts, where it does not count as a post...
Sorry for reposting this, believe it or not, I only figured out it was broken last night after my posts kept disappearing on me.
thanks
p.s.
unrelated question...
Notice on the last row that because the title of one article is longer than the others that my rows heights are not even?
Is there some bonehead css trick that I am missing to force equal heights within my rows?
also:
If anyone is bored, I'd love it for people to 'tear my theme apart'. It is the first theme I have ever built, and while I am not yet finished 'single.php, etc', I'm curious what people think. I'm a php/js newb, but have been working my butt off on this for months now. If anything is glaringly wrong, I'd love to know about it. Trust me, I won't take it personal.
Answers (3)
Michael Fields answers:
This is because you are using an if/else statement. What you need here is to scrap the else and always print the post code.
shawn comments:
hmmm I end up with
pic pic pic
pic pic pic
pic
pic pic pic
http://shawn.theanointedone.com/photogalleries/
I simply removed the else statement
<?php if ( 0 ==$count%4 ) { ?>
<li class="cleaner"> </li>
<?php } ?>
Michael Fields comments:
It looks like you might want to change
$count%4
to
$count%3
Template looks like it should only fite 3 per row. You clearer is printing every fourth
shawn comments:
Nope now I get
pic pic
pic pic pic
pic pic pic
pic pic
Michael Fields comments:
That's actually perfect. Next step would be to move the clearing div to the bottom of the loop.
Michael Fields comments:
and by "div" I mean "li" :)
shawn comments:
Bingo!
Let me go ahead and add in a bunch more posts tomorrow so that I can test this across mutliple pages before I close this question out again. It's 1am here, to tired to do it tonight.
If all goes well, I'll select your answer as winner..
---Can you easily explain to me why it works when moved?
I'm still learning, and it helps me to understand the logic behind what I am doing for future use.
thanks
Michael Fields comments:
No problem! Since your incrementing statement ( $count++ ) executes at the beginning of the loop, it actually does not start at zero, it starts at one. so this is happening:
post 1: count = 1, remainder exists; print post
post 2: count = 2, remainder exists; print post
post 3: count = 3, remainder exists; print post
post 4: count = 4, no remainder; print clear; print post
By moving it to the end of the loop you get this:
post 1: count = 1, remainder exists; print post
post 2: count = 2, remainder exists; print post
post 3: count = 3, remainder exists; print post
post 4: count = 4, no remainder; print post; print clear;
Hope this makes sense, kinda hard to illustrate via text :)
Nilesh shiragave answers:
Try this.. it will work
<div id="archive">
<ul class="posts posts-3 grid">
<?php woo_loop_before(); ?>
<?php if (have_posts()) : $count = 0; ?>
<?php while (have_posts()) : the_post(); $count++; ?>
<!-- Post Starts -->
<?php woo_post_before(); ?>
<?php if ( 0 ==$count%4 ) { ?>
<li class="cleaner"> </li>
<?php } ?>
<li>
<div class="cover-image">
<a href="<?php the_permalink() ?>">
<?php woo_image('width=218&height=150&class=photofade&single=true&link=img'); ?>
</a>
</div><!-- /.cover-image -->
<div class="postcontent">
<h2 class="title">
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a>
</h2>
<p class="hidden"><?php the_time('F jS, Y') ?> | <?php the_category(', ') ?></p>
<p>
<?php ob_start();
the_excerpt('Read the full post',true);
$postOutput = preg_replace('/<img[^>]+./','', ob_get_contents());
ob_end_clean();
$excerpt_length = "40";
echo woo_text_trim( $postOutput, $excerpt_length); ?>
</p>
<p class="hidden separator"></p>
<p class="showme"><?php the_time('F jS') ?> | <?php the_category(', ') ?></p>
</div><!-- /.postcontent -->
<p class="hidden separator"></p>
</li>
<?php woo_post_after(); ?>
<?php endwhile; else: ?>
<div class="post">
<p><?php _e('Sorry, no posts matched your criteria.', 'woothemes') ?></p>
</div><!-- /.post -->
<?php endif; ?>
</ul>
</div><!-- /.archive -->
Nilesh shiragave comments:
Removed else condition as it is skipping your fourth post. like 4,8,12.... post will exclude with your previous code.
shawn comments:
That's pretty much what Michael just told me to do, which I did, and you can see the results now. Not working as expected.
Nilesh shiragave comments:
so 4th post is still not displaying? can you show me website url where you are working.
shawn comments:
[[LINK href="http://shawn.theanointedone.com/photogalleries/"]][http://shawn.theanointedone.com/photogalleries/[/LINK]]
shawn comments:
Michael got it fixed for me..
thanks for your time. Looks like I just had the clearing 'li' in the wrong spot which is why your code wasn't working either.
Nilesh shiragave comments:
ok..
Gabriel Reguly answers:
Hi,
I am glad to see that Michael Fields was able to help you.
Indeed my code was broken, it was skipping every 3rd post.
Probably it was the rush to give a fast answer.
Would you lika a refund?
Regards,
Gabriel
shawn comments:
Thanks for the offer but seriously no worries. It was my fault for not fully testing it first anyhow. I'm just happy to have a resource like this site where I can come and ask questions from great people.
Tell ya what...
take 2 mins and visit my theme that I am working on, tell me one thing that you would change and I'll be more than happy. (it's my first time building a theme so looking for opinions from experts)
http://shawn.theanointedone.com
--keep in mind, it's a work in progress, have not even begun to style the single.php or comments etc... If you hate or love it, that's ok, just curious of opinions before I put it out there.
thanks