How can I add a certain class to the ul based on how many images there are?
So when there is 2 images the ul get class"images one-photo"
and when there are 5 images the ul gets the class class"images five-photo"
and so on...
What I now have in code :
<?php if( have_rows('blog_item') ): ?>
<?php while( have_rows('blog_item') ): the_row(); ?>
<ul class="images">
<?php if( get_sub_field('photo-01') ): ?>
<li><img src="https://www.website.com/<?php the_sub_field('photo-01'); ?>" alt="" /></li>
<?php endif; ?>
<?php if( get_sub_field('photo-02') ): ?>
<li><img src="https://www.website.com/<?php the_sub_field('photo-02'); ?>" alt="" /></li>
<?php endif; ?>
<?php if( get_sub_field('photo-03') ): ?>
<li><img src="https://www.website.com/<?php the_sub_field('photo-03'); ?>" alt="" /></li>
<?php endif; ?>
</ul>
<?php endwhile; ?>
<?php endif; ?>
Something like this would come to mind:
<?php
$count = 0;
$image_display = '';
for($i=1 ; $i <= 3; $i++){
if( get_sub_field('photo-0'.$i) ):
$count++; // count photos here
$image_display .= '<li><img src="https://www.website.com/'.the_sub_field("photo-0".$i).'" alt="" /></li>';
endif;
}
$class = '';
switch ($count) {
case 1: $class = 'one-photo';break;
case 2: $class = 'two-photo';break;
case 3: $class = 'three-photo';break;
case 4: $class = 'four-photo';break;
case 5: $class = 'five-photo';break;
}
echo '<ul class="images '.$class.'">'. $image_display.'</ul>';
?>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.