整合Zurb的Orbit Slider 在我的主题中，我尝试使用WordPress生成此HTML：
<div id="featured">
<img src="featured-image-1.jpg" alt="the-alt-tag" data-caption="#htmlCaption-1" />
<img src="featured-image-2.jpg" alt="the-alt-tag" data-caption="#htmlCaption-2" />
<img src="featured-image-3.jpg" alt="the-alt-tag" data-caption="#htmlCaption-3" />
</div>
<span class="orbit-caption" id="htmlCaption-1"><a href="#">The post title 1</a></span>
<span class="orbit-caption" id="htmlCaption-2"><a href="#">The post title 2</a></span>
<span class="orbit-caption" id="htmlCaption-3"><a href="#">The post title 3</a></span>
我设法在一个div中获得了一个特色图像列表，但我不知道如何：
向每个图像标记添加唯一的数据属性，如下所示：data-caption="#htmlCaption-1" （我想我需要运行preg_replace() 插入自定义HTML的函数？）Edit: 我刚刚发现rewind_posts(); 我们可以多次使用同一查询
// Get the latest 5 sticky posts from the \'events\' post type
$args = array(
\'post_type\' => \'event\',
\'posts_per_page\' => 5,
\'post__in\' => get_option( \'sticky_posts\' )
);
$slider_query = new WP_Query( $args );
// Display the featured images in div
echo \'<div id="featured">\';
while ( $slider_query->have_posts() ) : $slider_query->the_post();
the_post_thumbnail();
endwhile;
$slider_query->rewind_posts();
echo \'</div>\';
// Print the captions
while ( $slider_query->have_posts() ) : $slider_query->the_post();
echo \'<span class="orbit-caption"><a href="\';
the_permalink();
echo \'">\';
the_title();
echo \'</a></span>\';
endwhile;
// Reset Post Data
wp_reset_postdata();
?>
希望有人能帮忙。谢谢
最合适的回答,由SO网友:amit 整理而成
我会使用此代码来打印图像，而不是使用the_post_thumbnail();.
因此$slider_query->current_post 可用于打印WP\\U查询循环中post的当前迭代。
例如：。
<img src="<?php wp_get_attachment_url( get_post_thumbnail_id() ); ?>" alt="the-alt-tag" data-caption="#htmlCaption-<?php $slider_query->current_post; ?>" />
更新-未测试，但它应该可以工作。确保打开
WordPress debug 在开发之前。
<?php
// Get the latest 5 sticky posts from the \'events\' post type
$args = array(
\'post_type\' => \'event\',
\'posts_per_page\' => 5,
\'post__in\' => get_option( \'sticky_posts\' )
);
$slider_query = new WP_Query( $args );
// Display the featured images in div
echo \'<div id="featured">\';
while ( $slider_query->have_posts() ) : $slider_query->the_post() ;
echo \'<img src="\'.wp_get_attachment_url( get_post_thumbnail_id() ).\'" alt="the-alt-tag" data-caption="#htmlCaption-\'.$slider_query->current_post.\'" />\';
endwhile;
$slider_query->rewind_posts();
echo \'</div>\';
// Print the captions
while ( $slider_query->have_posts() ) : $slider_query->the_post();
echo \'<span class="orbit-caption" id="htmlCaption-\'.$slider_query->current_post.\'><a href="\';
the_permalink();
echo \'">\';
the_title();
echo \'</a></span>\';
endwhile;
// Reset Post Data
wp_reset_postdata();
?>
