Duplicate posts in my custom loop

You’re trying to loop through the thumbnail, which doesn’t make any sense:

foreach ($thumbnail as $thumb){

And then inside the loop you’re referring to $thumbnail again anyway:

<img class="thumbnail zoom" src="https://wordpress.stackexchange.com/questions/280435/<?php  echo $thumbnail[0];?>" >

wp_get_attachment_image_src() returns an array that looks like this:

array(
    0 => 'http://website.com/path/to/image.jpg', // URL 
    1 => 150, // Width
    2 => 150, // Height
    3 => true // Is a resized version?
);

So when you try to loop through that, you’re looping through those 4 values. But since you use $thumbnail[0] in the loop, it’s just going to echo that first value 4 times.

And since you’re doing this all inside while ( $loop->have_posts() ) : $loop->the_post(); you’re going to echo the URL for the featured image 4 times for each post.

This would be the simplest approach:

$args = array( 
    'post_type'      => 'service_slider', 
    'posts_per_page' => 5
);

$loop = new WP_Query( $args );

while ( $loop->have_posts() ) : $loop->the_post();
    echo '<div class="item">';
    echo wp_get_attachment_image( get_post_thumbnail_id(), 'thumbnail', false, array( 'class' => 'thumbnail zoom' ) );
    echo '</div>';
endwhile; wp_reset_postdata();

while ( $loop->have_posts() ) : $loop->the_post(); is looping through the posts. You won’t need a foreach at all. Then inside that loop I’ve output the item div and the post’s featured image.

Note that I’ve used wp_get_attachment_image(), which outputs the fill image tag for the current post thumbnail (because I passed it get_post_thumbnail_id(). The 4th parameter lets you pass an image class to use. This function all also automatically pull in the alt text, which is good for accessibility.

Related Posts: