我已经将自举旋转木马整合到我的wordpress中。幻灯片将从将被标记为“精选”的帖子中删除，因此最近只会显示5个“精选”帖子。
以下是我的代码：
<div id="carousel-captions" class="carousel slide bs-docs-carousel hidden-xs">
<ol class="carousel-indicators">
<li data-target="#carousel-captions" data-slide-to="0" class="active"></li>
<li data-target="#carousel-captions" data-slide-to="1" class=""></li>
<li data-target="#carousel-captions" data-slide-to="2" class=""></li>
<li data-target="#carousel-captions" data-slide-to="3" class=""></li>
<li data-target="#carousel-captions" data-slide-to="4" class=""></li>
</ol>
<div class="carousel-inner">
<?php $the_query = new WP_Query( 'tag=featured&orderby=date&posts_per_page=5' ); ?>
<?php if ( $the_query->have_posts() ) : ?>
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="item">
<a href="<?php the_permalink() ?>">
<img src="<?php the_field('header_banner', $post_id); ?>" alt="">
<div class="carousel-caption">
<h3><?php the_field('year', $post_id); ?></h3><span class="name">Make<br><?php $category = get_the_category(); echo $category[0]->cat_name; ?></span><hr>
<p><?php the_field('mileage', $post_id); ?> Miles | <?php the_field('exterior_color', $post_id); ?> Color<br><br><?php echo homepage_carousel_excerpt(15); ?></p><span class="btn btn-default">Details →</span>
</div></a>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>
</div>
<a class="left carousel-control" href="#carousel-captions" data-slide="prev">
<span class="icon-prev"></span>
</a>
<a class="right carousel-control" href="#carousel-captions" data-slide="next">
<span class="icon-next"></span>
</a>
</div>
问题是它没有滑动，因为“活动”类不能静态工作。
我能解决这个问题吗？
由于
答案 0 :(得分：5)
为避免必须两次查询，可以在循环外设置一个变量设置为1。在循环中，当它等于1时，你添加“active”类，然后你递增它。
<?php
// Previous code here...
$i = 1;
while ( $the_query->have_posts() ) :
$the_query->the_post();
?>
<div class="item<?php if ($i == 1) echo 'active'; ?>">
</div>
<?php
$i++;
endwhile;
wp_reset_postdata();
?>
答案 1 :(得分：0)
自定义帖子类型的Bootstrap 3（此处命名为＆＃34; diapositives＆＃34;）：
<!-- Define the loop -->
<?php $diapositivesloop = new WP_Query( array( 'post_type' => 'diapositives', 'posts_per_page' => -1 ) ); ?>
<?php $i=1; ?>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<?php while ( $diapositivesloop->have_posts() ) : $diapositivesloop->the_post(); ?>
<?php the_content(); ?>
<div class="item <?php if ($i == 1) echo 'active'; ?>">
<img src="<?php echo wp_get_attachment_url( get_post_thumbnail_id() ); ?>" alt="...">
<div class="carousel-caption">
<a href="<?php the_permalink() ?>"><h3><?php the_title(); ?></h3></a>
</div>
</div>
<!-- End of the loop -->
<?php $i++; ?>
<?php endwhile; wp_reset_query(); ?>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
答案 2 :(得分：0)
这是我提出的解决方案：
<?php
$args = array(
'post_type' => 'slides',
'oderby' => 'menu_order',
'posts_per_page' => -1
);
$slides = new WP_Query( $args );
if( $slides->have_posts() ): ?>
<div class="row">
<div class="col-xs-12">
<!--Twitter bootstrap Photo carrousel-->
<div id="myCarousel" class="carousel slide center-block" data-ride="carousel" >
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="4"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<?php while( $slides->have_posts() ) : $slides->the_post(); $index++ ?>
<?php if ( $index == 1 ): ?>
<div class="item active">
<?php else: ?>
<div class="item">
<?php endif; ?>
<?php $url = wp_get_attachment_url( get_post_thumbnail_id() ); ?>
<img src="<?php echo $url; ?>" alt="<?php the_title(); ?>">
</div>
<?php endwhile; ?>
<?php endif; ?>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div><!-- carrousel ends here -->
我通过观看以下视频了解到了这一点：用户Ezer Sanbe的Integrating the Bootstrap Carousel into the WordPress theme 。所有归功于他。
希望这有帮助
答案 3 :(得分：0)
fun insertPerson() {
database.use {
insert(PersonTable.Name,
PersonTable.PersonName to "XX",
PersonTable.Domain to "Technology",
PersonTable.MobileNumber to "XXXXX")
}
}
object PersonTable {
val Name = "Person"
val ID = "id"
val PersonName = "person_name"
val Domain = "domain"
val MobileNumber = "mobile_number"
}
答案 4 :(得分：0)
在没有插件的WordPress中集成Bootstrap轮播
i starts with `huge`
j starts with `huge`
f loops `huge, hairy, pants`
j jumps to `hairy`
f loops `huge, hairy, pants`
j jumps to `pants`
f loops `huge, hairy, pants`
i jumps to `hairy`
j starts with `huge`
f loops `huge, hairy, pants`
j jumps to `hairy`
f loops `huge, hairy, pants`
j jumps to `pants`
f loops `huge, hairy, pants`
i jumps to `pants`
j starts with `huge`
f loops `huge, hairy, pants`
j jumps to `hairy`
f loops `huge, hairy, pants`
j jumps to `pants`
f loops `huge, hairy, pants`
loop end