Last active
August 29, 2015 14:03
-
-
Save j-cam/75aa134432928b2edf95 to your computer and use it in GitHub Desktop.
Create 2 equal columns of grid items from an Advanced Custom Fields repeater field. The left column will contain more items if the number of results is an odd number.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="row"> | |
<?php | |
// ACF_REPEATER_FIELD_NAME Repeater | |
if( get_field( 'ACF_REPEATER_FIELD_NAME' ) ): | |
// Get number of items from the result | |
$numItems = sizeof( get_field( 'ACF_REPEATER_FIELD_NAME' ) ); | |
// Divied by 2 and round up to distribute evenly between the columns | |
$itemsPerColumn = round( $numItems/2 ); | |
// Intialize an iterator for displacing an odd number of results | |
$itemNum = 0; | |
?> | |
<!-- LEFT COLUMN DIV --> | |
<div class="col-1-2"> | |
<?php | |
while( has_sub_field('ACF_REPEATER_FIELD_NAME') ): | |
$itemNum++; | |
?> | |
<div class="item-wrapper"> | |
<div class="item"> | |
<header> | |
<h3><?php the_sub_field('item_title'); ?></h3> | |
<h5><?php the_sub_field('item_subtitle'); ?></h5> | |
</header> | |
<div class="item-info"> | |
<p> | |
<?php the_sub_field('item_description'); ?> | |
</p> | |
</div><!-- / item info --> | |
</div><!-- / .item --> | |
</div><!--/ item-wrapper --> | |
<?php | |
// Close the left column div if the max is reached and open the second column div | |
if($itemNum == $itemsPerColumn): | |
?> | |
</div><!-- /col-1-2 LEFT COLUMN --> | |
<!-- RIGHT COLUMN DIV --> | |
<div class="col-2-2"> | |
<?php endif; ?> | |
<?php | |
// Close the right column when the end is reached | |
if($itemNum == $numItems): | |
?> | |
</div><!-- /col-2-2 --> | |
<?php endif; ?> | |
<?php endwhile; ?> | |
<?php endif; // ACF_REPEATER_FIELD_NAME ?> | |
</div><!-- / .row --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment