mardi 21 août 2018

PHP only show photo in slider if value is not empty

I'm trying to make a slider and it works perfectly when 3 images are uploaded in the backend. It doesn't work when there are fewer.

For example, if there are only 2 images then it should only show 2 slides.

<div id="myCarousel" class="carousel slide" data-ride="carousel">
              <!-- Indicators -->
              <ol class="carousel-indicators">
                <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
               <li data-target="#myCarousel" data-slide-to="1"></li>                   
               <li data-target="#myCarousel" data-slide-to="2"></li>                  
              </ol>

              <!-- Wrapper for slides -->
              <div class="carousel-inner" >




                <div class="item active">
                  <img src="<?php the_field('afbeelding')?>" alt="<?php the_title() ?>">
                </div>



                <div class="item">
                  <img src="<?php the_field('afbeelding_2');?>" alt="">
                </div>  



                <div class="item">
                  <img src="<?php the_field('afbeelding_3');?>" alt="">
                </div>                  

              </div>

              <!-- Left and right controls -->
              <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left"></span>
                <span class="sr-only">Previous</span>
              </a>
              <a class="right carousel-control" href="#myCarousel" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right"></span>
                <span class="sr-only">Next</span>
              </a>
            </div>  

I tried to fix it by changing each item to this:

                <?php if(isset(the_field('afbeelding_2'))){?>
                 <div class="item">
                   <img src="<?php the_field('afbeelding_2');?>" alt="">
                 </div> 
                <?php } ?>

But it didn't work...

Help would be very much appreciated!

Aucun commentaire:

Enregistrer un commentaire