0

So i want to show the images i put in a post to automatically show up in a carousel if there is more than 1 image found. I put the bootstrap Carousel in the Single-Post.php but the get_attached_media function is only finding the Featured Image of that post. Anybody know a better way to get the images from a post and show them in a carousel?

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
                    
                    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                      <ol class="carousel-indicators">
                        <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
                      </ol>
                      <div class="carousel-inner">
                          <?php 
                          
                          
                            $attimages = get_attached_media('image', $post->ID);
                            foreach ($attimages as $image) {
                                echo wp_get_attachment_url($image->ID).'<br>';
                                ?>
                                <div class="carousel-item active">
                                  <img class="d-block w-100" src="<?php echo wp_get_attachment_url($image->ID); ?>" alt="First slide">
                                </div>
                          <?php
                          
                            }
                          ?>
                        
                      <a class="carousel-control-prev" href="#carouselExampleIndicators" 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="#carouselExampleIndicators" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                      </a>
                    </div>

Thanks in advance!

3
  • Not sure if this is what you mean by uploading to a post directly but i first make a post, put a few images in and then i want to display them in a carousel – Sander105 Feb 12 at 13:20
  • Quick note, don't enqueue your stylesheets and scripts like that: developer.wordpress.org/reference/functions/wp_enqueue_script – Tony Djukic Feb 12 at 15:01
  • get_attached_media() will only grab the item if it was first uploaded to a specific post, from within the post (and that's how it get the 'is used on' designation)... ...try uploading and attaching multiple images while IN the post and not assigning anything that is already in the media library. To be honest, a much simpler approach would be to just use the custom fields already built into WP and just list the IDs of the images you want to associate as a comma separated list. Then get that custom field, break up the array and run your code. – Tony Djukic Feb 12 at 15:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.