So I’m working on a HTML carousel using Twitter Bootstrap, WordPress and ACF Fields.
This carousel shows 2 items per row. Each of these items has a class of “col-md-6”. So by showing 2 items per row, the total is 2 columns of “col-md-6″ (which is perfect since this completes the 12 columns required by Bootstrap):
Here is my code:
<?php if (have_rows(‘columns_carousel_slide’)) {
$count = 0; ?>
<div class=”item active”><div class=”row”>
<?php while(have_rows(‘columns_carousel_slide’)) {
the_row();
if ($count > 0 && (($count % 2) == 0)) {
?>
</div> <!–.item –>
</div> <!–.row –>
<div class=”item”>
<div class=”row”>
<?php } ?>
<div class=”col-md-6″>
<h2><?php the_sub_field(‘columns_carousel_slide_title’); ?></h2>
</div> <!–.col-md-6 –>
<?php $count++; } ?>
</div> <!–.item –>
</div> <!–.row –>
<?php } ?>
However, I would like to know if there’s a way to detect if there’s 1 item per row and if so, then show a “col-md-12” instead of a “col-md-6” in order to fill in the remaining space of not having 2 items.
Any ideas are welcome.
Thanks!
instead on using the_sub_field() use get_sub_field() for the values and check to see that each has a value.
I’m not really sure how to do this by looking at your code. If I’m getting what you’re doing right then if you’re looking at the first item for the row then you need to look ahead to the next row and that’s not something that possible using a have_rows loop. Instead what you’ll need to do is get the entire repeater into an array and loop over the array instead.
// this will show you what's in the repeater
$rows = get_field('columns_carousel_slide');
echo '<pre>'; print_r($rows); echo '</pre>';
