Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Shane McC
Shane McC
3,005 Points
Posted by Shane McC
Shane McC
3,005 Points

Looping through Images?

Hi Everyone,

I'm attempting to loop through images on my homepage to create a slider. My syntax below isn't working. I'm using bootstrap. If I hard code the information in, it works great but as soon as I dynamically write php it's not working.I'm not entirely sure what I'm doing wrong. Any help would be appreciated, thanks.

Syntax that isn't working

<div class="span8"> <div id="slider" class="carousel slide hidden-phone"> <div class="carousel-inner">

                <?php $new_query = new WP_Query('post_type=slide&posts_per_page=-1');
                    while($new_query->have_posts()) : $new_query->the_post();
                ?>

                    <div class="item active">
                        <img src="<?php the_field("slide_image"); ?>" alt="<?php the_title(); ?>">
                        <div class="carousel-caption hidden-phone">
                            <h4><?php the_title(); ?></h4>
                            <p><?php the_field("slide_caption"); ?></p>
                        </div>
                    </div>

                <?php endwhile; ?>

                </div>
                <ol class="carousel-indicators">
                    <li data-target="#slider" data-slide-to="0" class="active"></li>
                    <li data-target="#slider" data-slide-to="1" ></li>
                    <li data-target="#slider" data-slide-to="2" ></li>
                </ol>
            </div>
        </div>

3 Answers

JP Nothard
JP Nothard
3,846 Points
JP Nothard
JP Nothard
3,846 Points

Hi Shane,

Your loop looks like it should work.

Is it just the images that are not showing or is it everything in the loop, also are you using Advanced Custom Fields for the image upload?

Shane McC
Shane McC
3,005 Points
Shane McC
Shane McC
3,005 Points

Hi JP,

The images are showing up fine, it's the slider that isn't working.

I am using Advanced Custom Fields for Image uploads.

I have a Field Name called slide_image type Image and slide_caption type Text Area

Shane McC
Shane McC
3,005 Points
Shane McC
Shane McC
3,005 Points

Hi JP,

The images are showing up fine, it's the slider that isn't working.

I am using Advanced Custom Fields for Image uploads.

I have a Field Name called slide_image type Image and slide_caption type Text Area

JP Nothard
JP Nothard
3,846 Points
JP Nothard
JP Nothard
3,846 Points

if you are running more than one loop on the page you could try and reset the loop with 

<?php endwhile; wp_reset_query(); ?>
Shane McC
Shane McC
3,005 Points
Shane McC
Shane McC
3,005 Points

Hi JP,

I'm only running one loop on my homepage. I appreciate the reply but wp_reset_query(); didn't work.