Custom Loop Needed WordPress

WP Answers comments:

Hi,

I commented out those 2 lines, and the posts display properly. Thank you. The only problem now is that it does not add the <br class="clear" /> after there are 3 items added. I need the BR to get added every time a row of 3 is added.

Any ideas?

Here's the code again that's in working order:


<?php
$item_count = '9';
$category_id = '31';
$query_string ="posts_per_page=$item_count&cat=$category_id";

/* $empty_item = add_new_line(4) .'<div class="threecol"> &nbsp; </div>';
$clear_row = add_new_line(4) .'<br class="clear" />'. add_new_line(4) . add_new_line(0); */

query_posts($query_string);

$count = 0;
if (have_posts()) : while (have_posts()) : the_post();
$count++;
$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;
$portfolio_thumb_image_url = get_post_meta($post->ID, "portfolio_thumb_image_url", true);
$portfolio_full_image_url = get_post_meta($post->ID, "portfolio_full_image_url", true);
?>


<div class="threecol">
<?php if ( has_post_thumbnail() ) : ?>
<div class="img_frame_port">
<div class="fade"><a href="#"><?php the_post_thumbnail(); ?></a></div><!-- end fade -->
</div><!-- end img_frame_port -->
<?php endif; ?>
<h3><?php echo strtoupper(get_the_title()); ?></h3>
<?php the_content(); ?>
</div><!-- end threecol -->


<?php
if ( $mod == 0 ) echo $clear_row;
endwhile; endif;

for ( $i = 0; $i < $mod; $i++ ) echo $empty_item;
if ( $count < 3 || $mod != 0) echo $clear_row;



Buzu B comments:

try changing this

<?php

if ( $mod == 0 ) echo $clear_row;

endwhile; endif;

to this:


<?php

if ( $mod == 0 ){
echo '<br class="clear" />';
}

endwhile; endif;


WP Answers comments:

Thank you for this. The loop is functioning properly.

My only problem now is that with the way my HTML/CSS is currently written, every 3rd row needs to have a different class name. So, column 1 and column 2 have a class of "threecol", and column 3 needs a class of "threecol_last". Is there any easy way to modify the loop so that the 3rd column gets this new class? If not, I suppose I can modify my CSS/HTML structure so all 3 columns use the same class name.

<strong>Here is the working code so far:</strong>

<?php
$item_count = '9';
$category_id = '31';
$query_string ="posts_per_page=$item_count&cat=$category_id";

query_posts($query_string);

$count = 0;
if (have_posts()) : while (have_posts()) : the_post();
$count++;
$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;
$portfolio_thumb_image_url = get_post_meta($post->ID, "portfolio_thumb_image_url", true);
$portfolio_full_image_url = get_post_meta($post->ID, "portfolio_full_image_url", true);
?>


<div class="threecol">
<?php if ( has_post_thumbnail() ) : ?>
<div class="img_frame_port">
<div class="fade"><a href="#"><?php the_post_thumbnail(); ?></a></div><!-- end fade -->
</div><!-- end img_frame_port -->
<?php endif; ?>
<h3><?php echo strtoupper(get_the_title()); ?></h3>
<?php the_content(); ?>
</div><!-- end threecol -->


<?php
if ( $mod == 0 ){
echo '<br class="clear" />';
}
endwhile; endif;
?>


Buzu B comments:

change this:


$count = 0;

if (have_posts()) : while (have_posts()) : the_post();

$count++;

$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;

$portfolio_thumb_image_url = get_post_meta($post->ID, "portfolio_thumb_image_url", true);

$portfolio_full_image_url = get_post_meta($post->ID, "portfolio_full_image_url", true);

?>





<div class="threecol">


to this:


$count = 0;
$col = 0;

if (have_posts()) : while (have_posts()) : the_post();

$count++;

//$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;

if($count % 3 == 0){
$mod = 0;
$col ++;
}else{
$mod = 3 - $count % 3;
}

$portfolio_thumb_image_url = get_post_meta($post->ID, "portfolio_thumb_image_url", true);

$portfolio_full_image_url = get_post_meta($post->ID, "portfolio_full_image_url", true);

?>





<div class="threecol<?php if($col == 3){ echo '_last'; $col = 0; } ?>">


I think that'd do it.

WP Answers comments:

Hi,

I added that code, but it does not add the different class to the 3rd item. If you can look at it again that'd be great, but if not, I will try to modify mt HTML/CSS and see how that works out.

Thank you very much for all your help.

Here is the code as of now (it works but doesn't add unique class to 3rd item):

<?php
$item_count = '9';
$category_id = '31';
$query_string ="posts_per_page=$item_count&cat=$category_id";

query_posts($query_string);

$count = 0;
$col = 0;
if (have_posts()) : while (have_posts()) : the_post();
$count++;
//$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;
if($count % 3 == 0){
$mod = 0;
$col ++;
}else{
$mod = 3 - $count % 3;
}
?>



<div class="threecol<?php if($col == 3){ echo '_last'; $col = 0; } ?>">
<?php if ( has_post_thumbnail() ) : ?>
<div class="img_frame_port">
<div class="fade"><a href="#"><?php the_post_thumbnail(); ?></a></div><!-- end fade -->
</div><!-- end img_frame_port -->
<?php endif; ?>
<h3><?php echo strtoupper(get_the_title()); ?></h3>
<?php the_content(); ?>
</div><!-- end threecol -->



<?php
if ( $mod == 0 ){
echo '<br class="clear" />';
}
endwhile; endif;
?>


Buzu B comments:

Try changing
class="threecol<?php if($col == 3){
to
class="threecol<?php if($col == 2){

WP Answers comments:

Getting closer! Currently I have 6 posts being pulled in (so two rows of 3 items)

When I changed the code, the second row of items behaves correctly (the 3rd item gets the unique class), but the first row of items still doesn't behave correctly (the 3rd item does not get the unique class)

Any ideas?

Buzu B comments:

Ah, ok. I think I misunderstood what you were trying to do.

Take the $col ++ out of the if and place it just below the $count++ then reverse the 2 you just changed the 3 we had before.


<?php

$item_count = '9';

$category_id = '31';

$query_string ="posts_per_page=$item_count&cat=$category_id";



query_posts($query_string);



$count = 0;

$col = 0;

if (have_posts()) : while (have_posts()) : the_post();

$count++;
$col ++;

$mod = ($count % 3 == 0) ? 0 : 3 - $count % 3;

?>







<div class="threecol<?php if($col == 3){ echo '_last'; $col = 0; } ?>">

<?php if ( has_post_thumbnail() ) : ?>

<div class="img_frame_port">

<div class="fade"><a href="#"><?php the_post_thumbnail(); ?></a></div><!-- end fade -->

</div><!-- end img_frame_port -->

<?php endif; ?>

<h3><?php echo strtoupper(get_the_title()); ?></h3>

<?php the_content(); ?>

</div><!-- end threecol -->







<?php

if ( $mod == 0 ){

echo '<br class="clear" />';

}

endwhile; endif;

?>


I also deleted the if() and uncommented the conditional you had before. This should work, that is if I understood this time what it is you are trying to do.