0

I'm pulling in posts from a specific category using twitter bootstrap carousel rotator. I've looking into double loops but I can't figure out how to implement it.

Here is my loop:

$query = array( 'posts_per_page' => 4, 'cat' => 3); $queryObject = new WP_Query($query); $count = 0; if($queryObject): while($queryObject->have_posts() ) : $queryObject->the_post(); $count++;

Pretty much it pulls in 4 posts(which I currently have up) from category 3

<div class="item <?php if($count === 1){ echo " active"; }elseif($count >=4){ echo " "; } ?>"> <div class="span4"> <?php the_content();?> </div><!--end of span4--> </div>

What I'm trying to do is repeat the div element <div class="span4">, so essentially something like this. Originally what I have above with the if else statement I got <div class="item"> to have the class active on the first three post and on the fourth post just have nothing. With that it just wasn't rotating, so I'm trying this option.

<div class="item active"> <div class="span4"><?php the content();?></div> <div class="span4"><?php the content();?></div> <div class="span4"><?php the content();?></div>

EDIT: For some reason my code is being trimmed off.

I've tried experimenting with the double loop feature but it's not working as I want it too,maybe my logic is off, but with the double loop there's an offset which I don't want. Any suggestion would be nice.

Pastebin.

Thanks.

Improve this question
1
  • Whats the output? Commented Jul 19, 2013 at 18:40

1 Answer 1

Reset to default
0

The best solution is create a function that create the output. In addiction this gives more flexibility using function options.

The code, tested, is here:

<?php function wp_bootstrap_carousel($args = '', $visible = 3, $active = 0) { // cannot show more than 12 items at once if ( ! intval($visible) || $visible > 12 ) return false; $query = new WP_Query($args); if ($query->have_posts() ) { $i = -1; $output = ''; // calculate the span class depending on desired visible items $span = floor(12 / $visible); // if 12 is not a perfect multiple of visible items, calculate the residue $span_residue = 12%$visible; $slides = 0; while ( $query->have_posts() ) : $i++; $query->the_post(); // set active only the desired active item $item_class = $i == $active ? 'item active' : 'item'; $u = ( ($i == 0) || $i % ($visible) == 0 ) ? 0 : $u+1; if ( $u == 0 ) { $slides ++; // open item div if needed $output .= sprintf('<div class="%s">', $item_class); } $output .= sprintf('<div class="span%d">%s</div>', $span, get_the_title() ); // close item div if needed if ( $u == ($visible-1) || $i == ($query->post_count-1) ) { // when on last post we always need to close the current item div, // if total is not divisible by visible we insert a "fake" item if ( $u != ($visible-1) ) $span_residue += ( ($visible-1) - $u ) * $span; if ( $span_residue > 0 ) { $output .= sprintf('<div class="span%d">&nbsp;</div>', $span_residue); } $output .= '</div>'; } endwhile; return array('items' => $output, 'total' => $query->post_count, 'slides' => $slides); } return false; } // query args $args = array( 'posts_per_page' => -1, 'cat' => 3 ); $active = 0; // the slide first visible $carousel = wp_bootstrap_carousel($args, 5, $active); if ( is_array($carousel) && $carousel['total'] > 0 ) : ?> <div id="myCarousel" class="carousel slide"> <ol class="carousel-indicators"> <?php for ($i = 0; $i < $carousel['slides']; $i++ ) : ?> <li data-target="#myCarousel" data-slide-to="<?php echo $i; ?>"<?php if ($i==$active) { ?> class="active"<?php } ?>></li> <?php endfor; ?> </ol> <!-- Carousel items --> <div class="carousel-inner"> <?php echo $carousel['items']; ?> </div> </div> <?php endif; ?>
Improve this answer
3
  • It seems to work. Only thing though is that extra div at the end is not breaking into a new "item" with new posts to rotate through. I been playing with it and got it kind of, my php is not the greatest, but that extra blank div at the end seems to through it off. Commented Jul 20, 2013 at 19:58
  • yes @jose there was 2 errors in previous code, now it should work. Commented Jul 21, 2013 at 0:36
  • Sorry for getting back to you late. It works. Thanks a lot. I'm just editing it too pull in the thumbnail, title and excerpt. I don't want to ask too much from you haha. Thanks a bunch! Commented Jul 22, 2013 at 15:08

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.