You don’t need a second loop. Just save all the data you need later during the first loop.
Sample code, not tested, just a hint:
<ul class="ei-slider-large">
<?php
// Here we store the data.
$second_loop = array();
// Main loop
$main_query = new WP_Query(
array(
'category_name' => 'featured',
'posts_per_page' => 3
)
);
if( $main_query->have_posts() ):
while( $main_query->have_posts() ):
$main_query->the_post();
?>
<li>
<?php the_post_thumbnail(); ?>
<div class="ei-title">
<h2><?php the_title_attribute(); ?></h2>
<h3><?php the_excerpt(); ?></h3></div>
</li>
<?php
// collect data, adjust the image size!
$second_loop[ $post->ID] = get_the_post_thumbnail( $post->ID, 'preview-size' );
endwhile;
endif;
wp_reset_query();
?>
</ul>
In your second loop you don’t need another query. Just use the array $second_loop
.
<ul class="ei-slider-thumbs">
<?php
foreach ( $second_loop as $post_id => $thumbnail )
{
?>
<li class="ei-slider-element">Current</li>
<li>
<a href="#">Slide 1</a>
<?php echo $thumbnail; ?>
</li>
<?php
}
?>
</ul>
Alternatively you could save the thumbnail URL as an attribute data-thumb
in the li
of the first list and create the second list in JavaScript.
Also read When should you use WP_Query vs query_posts() vs get_posts()?. query_posts()
has often some strange side effects.