Created
May 6, 2019 17:46
-
-
Save CarlasHub/eb326c6e1d64fee20d39308e97f469fe to your computer and use it in GitHub Desktop.
ACF bootstrap 4 carousel
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
| <?php | |
| //Get the images ids from the post_metadata | |
| $images = acf_photo_gallery('images', $post->ID); | |
| //Check if return array has anything in it | |
| if( count($images) ): | |
| //Cool, we got some data so now let's loop over it | |
| foreach($images as $image): | |
| $id = $image['id']; // The attachment id of the media | |
| $title = $image['title']; //The title | |
| $caption= $image['caption']; //The caption | |
| $full_image_url= $image['full_image_url']; //Full size image url | |
| $full_image_url = acf_photo_gallery_resize_image($full_image_url, 262, 160); //Resized size to 262px width by 160px height image url | |
| $thumbnail_image_url= $image['thumbnail_image_url']; //Get the thumbnail size image url 150px by 150px | |
| $url= $image['url']; //Goto any link when clicked | |
| $target= $image['target']; //Open normal or new tab | |
| $alt = get_field('photo_gallery_alt', $id); //Get the alt which is a extra field (See below how to add extra fields) | |
| $class = get_field('photo_gallery_class', $id); //Get the class which is a extra field (See below how to add extra fields) | |
| ?> | |
| <?php endforeach; | |
| endif; | |
| $images = acf_photo_gallery('images', $post->ID); | |
| if( count($images) ): | |
| $i = 0; | |
| ?> | |
| <div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> | |
| <div class="carousel-inner"> | |
| <?php foreach($images as $image): ?> | |
| <div class="carousel-item <?php echo $i == 0 ? ' active': ''; $i++; ?>"> | |
| <img class="d-block m-auto" src="<?php echo $image['full_image_url']; ?>" alt="First slide"> | |
| </div> | |
| <?php endforeach; ?> | |
| </div> | |
| <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> | |
| <span class="carousel-control-prev-icon" aria-hidden="true"></span> | |
| <span class="sr-only">Previous</span> | |
| </a> | |
| <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> | |
| <span class="carousel-control-next-icon" aria-hidden="true"></span> | |
| <span class="sr-only">Next</span> | |
| </a> | |
| </div> | |
| <?php | |
| endif; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment