Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.
Closed 5 years ago.
Improve this questionIm having a loop with count to add a clear after 4 items. It is working pretty well but theres one rebell row that will only take 1 post.
Code:
<section class="bonds-funding">
<h1>Funders</h1>
<?php the_field( "funding_subtitle" ); ?>
<?php $loop = new WP_Query( array( 'post_type' => 'institution', )
);
$counter = 0;
while ( $loop->have_posts() ) : $loop->the_post();
if ($counter % 4 == 0) :
echo $counter > 0 ? "</div>" : ""; // close div if it's not the first
echo "<div class='clearfix'>";
endif;
$colors = get_field('institution_status');
if( $colors && in_array('funding', $colors) ){ ?>
<div class="author-nucleus">
<a href="<?php echo get_field('institution_website', $user->ID); ?>">
<div class="author-avatar">
<!-- <div class="hexa">
<div class="hex1">
<div class="hex2"> -->
<img src="
<?php echo get_the_post_thumbnail_url( $user->ID ); ?>" />
<!-- </div>
</div>
</div> -->
</div>
</a>
<div class="author-info">
<div class="institution-padding">
<h2>
<?php the_title(); ?>
</h2>
</div>
<hr />
<?php
echo get_field('institution_subhead', $user->ID) ?>
<ul class="nucleus-icons-test">
<?php
$post_id = get_the_ID();
get_subjects($post_id, 'post', 6);
?>
</ul>
</div>
</div>
<?php }
$counter++;
endwhile;
wp_reset_query(); ?>
</section>
First 4 posts display correctly inside a div then, the next div displays only one post, then two more divs with correct count.
What the....?
Closed. This question is off-topic. It is not currently accepting answers.Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.
Closed 5 years ago.
Improve this questionIm having a loop with count to add a clear after 4 items. It is working pretty well but theres one rebell row that will only take 1 post.
Code:
<section class="bonds-funding">
<h1>Funders</h1>
<?php the_field( "funding_subtitle" ); ?>
<?php $loop = new WP_Query( array( 'post_type' => 'institution', )
);
$counter = 0;
while ( $loop->have_posts() ) : $loop->the_post();
if ($counter % 4 == 0) :
echo $counter > 0 ? "</div>" : ""; // close div if it's not the first
echo "<div class='clearfix'>";
endif;
$colors = get_field('institution_status');
if( $colors && in_array('funding', $colors) ){ ?>
<div class="author-nucleus">
<a href="<?php echo get_field('institution_website', $user->ID); ?>">
<div class="author-avatar">
<!-- <div class="hexa">
<div class="hex1">
<div class="hex2"> -->
<img src="
<?php echo get_the_post_thumbnail_url( $user->ID ); ?>" />
<!-- </div>
</div>
</div> -->
</div>
</a>
<div class="author-info">
<div class="institution-padding">
<h2>
<?php the_title(); ?>
</h2>
</div>
<hr />
<?php
echo get_field('institution_subhead', $user->ID) ?>
<ul class="nucleus-icons-test">
<?php
$post_id = get_the_ID();
get_subjects($post_id, 'post', 6);
?>
</ul>
</div>
</div>
<?php }
$counter++;
endwhile;
wp_reset_query(); ?>
</section>
First 4 posts display correctly inside a div then, the next div displays only one post, then two more divs with correct count.
What the....?
Share Improve this question edited Jul 25, 2019 at 18:12 artist learning to code asked Jul 23, 2019 at 20:21 artist learning to codeartist learning to code 3311 gold badge5 silver badges18 bronze badges2 Answers
Reset to default 1For your clearfix wrapper you are doing it wrong. You have this:
$counter = 0;
while ( $loop->have_posts() ) : $loop->the_post();
if ($counter % 4 == 0) :
echo $counter > 0 ? "</div>" : ""; // close div if it's not the first
echo "<div class='clearfix'>";
endif;
// BUILDS INTERNAL DIVS
$counter++;
endwhile;
So you are opening the div for numbers 0 and multiples of the number 4. Then inside that statement you are only closing a div if the $counter is greater than 0. So you end up closing the div, then opening a new one that may not get closed.
You need to do two things. First, move the closing div to echo at the end of the while statement. Second, wrap the closing div in a different conditional. Here it is corrected:
$counter = 0;
while ( $loop->have_posts() ) : $loop->the_post();
if ($counter % 4 == 0) {
echo "<div class='clearfix'>";
}
// BUILDS INTERNAL DIVS
/**
* Closing div for loop
*
* $counter is more than 0 AND $counter plus 1 is multiple of 4
* OR $counter plus 1 is the total posts found (the plus 1 here is because we start with 0 which counts toward our total)
*/
if ( ($counter > 0 && ($counter+1) % 4 == 0 ) || ($counter+1) == $loop->found_posts ) {
echo "</div>";
}
$counter++;
endwhile;
Why don't you just:
<style>
.author-nucleus:nth-of-type(4):after {
clear:both;
display: table;
content: "";
}
</style>
That's all you basically need in my opinion. The true beauty of css! No need to do weired counting with opening and closing div's.
Explaination: this css-rule will add a pseudo element after four row's/div's which will clear your float. Pro: lightweight, easyly changeable Cons: /
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745295375a4621107.html
评论列表（0条）