Wordpress PHP循环构建自定义滑块


Wordpress PHP loop building custom slider

这是我第一次在这里发帖。我发现这个网站很有帮助。我非常感谢开发者们对彼此的支持。

我正在wordpress中构建一个推荐滑块,对于一些背景知识(如果需要)我已经遵循;如何在WordPress中添加旋转推荐作为初学者。然后使用Boostrap编码推荐滑块,Simple Bootstrap推荐旋转木马(codepend .io/danielmdesigns/pen/yNzJwB)

我对HTML/Jquery这边很满意。PHP循环让我很头疼。PHP取自如何在Wordpress中从WP初学者旋转广告推荐,并尝试修改它为我自己的使用。

我对php代码中的问题进行了评论,凭借我有限的php知识,我希望每张幻灯片只发布一个证明,但从试验和错误来看,这与'php else'语句有关。目前在滑块中,它正在释放存储在CMS中的所有推荐,它应该在每个滑块中释放一个。如果你看一下数组代码,它上面有一个计数器。

对于endwhile和end if语句是相同的,我猜需要在php else语句中添加一些东西,但不确定什么类型的if语句。

<div class="carousel slide"  id="quote-carousel" data-ride="carousel">
<!-- Bottom Carousel Indicators -->
<ol class="carousel-indicators">
  <li data-target="#quote-carousel" data-slide-to="0" class="active"></li>
  <li data-target="#quote-carousel" data-slide-to="1"></li>
  <li data-target="#quote-carousel" data-slide-to="2"></li>
</ol>
<!-- Carousel Slides / Quotes -->
<div class="carousel-inner">
                <?php
                $args = array( 'post_type' => 'testimonial', 'posts_per_page' => 10 );
                $loop = new WP_Query( $args );
                if ( $loop->have_posts() ) : while ( $loop->have_posts() ) : $loop->the_post();
                $data = get_post_meta( $loop->post->ID, 'testimonial', true );
                static $count = 0;
                if ($count == "1") { ?>
<!-- Quote 1 -->
<div class="item active">
  <div class="row">
    <div class="col-sm-12">
      <p><?php the_content(); ?></strong></small>
    </div>
  </div>
</div> 


<!-- Quote 2 -->
<div class="item">
  <div class="row">
    <div class="col-sm-12">

<!-- this php else is the issue, one testimonial should only release per slide -->
    <?php } else  { ?>
      <p><?php the_content(); ?>
</p>
      <small><strong></strong></small>
    </div>
  </div>
</div>
    <?php
$count++; }
endwhile;
endif; ?>
</div>
我知道这是可能的,我只是不知道怎么做。我们将感激地接受任何指导。

试试这个:

<div class="carousel-inner">
                <?php
                $args = array( 'post_type' => 'testimonial', 'posts_per_page' => 10 );
                $loop = new WP_Query( $args );
                if ( $loop->have_posts() ){
                   while ( $loop->have_posts() ){
                         $loop->the_post();
                         $data = get_post_meta( $loop->post->ID, 'testimonial', true ); ?>
 <!-- Quote 1 -->
<div class="item active">
  <div class="row">
    <div class="col-sm-12">
      <p><?php the_content(); ?></strong></small>
    </div>
  </div>
</div> 
             <?php      }
                } ?>
</div> 

你似乎不需要别人,除非你没有推荐书的时候。在这种情况下,可以在else{}中显示可选内容。

我试图简化它,使它更清楚发生了什么。现在在循环内部,每次有一个推荐,它将重复<div class="item active">div,并在每次循环时放置当前推荐的内容。因此,它将循环遍历前10页(如'posts_per_page' => 10),并在每次出现推荐时继续打印出一张新幻灯片。

我已经包括行$data = get_post_meta( $loop->post->ID, 'testimonial', true );,虽然我不知道你在代码中使用它。数据变量将只保存内容,如果有一个自定义字段的ID为'证言'的推荐帖子类型。

我想结束这篇文章,因为我从http://thecodeblock.com/testimonial-slider-using-bootstrap-carousel/

找到了一个替代教程。

您需要编写和条件语句,以使活动类循环通过幻灯片,这是我使用的技术,使它与自定义帖子类型一起工作。

<div class="testimonials" id="testimonials">
<div class="container-fluid">
    <div class="row no-padding">
        <div class="testimonial-content">
            <div class="col-md-push-2 col-md-3">
              <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <?php 
                    if( $query->have_posts() ) : 
                      while( $query->have_posts() ) : 
                        $query->the_post(); 
                        $i++;
                  ?>
                    <div class="item <?php if ( $i == 1 ) {echo 'active';} ?>">
                      <p><?php the_field('testimonial'); ?></p>
                      <div class="testimonials-image">
                          <img class="img-responsive" src="<?php the_field('testimonial_image'); ?>" alt="">
                      </div>
                      <h5><?php the_field('testimonial_name'); ?></h5>
                      <h6><?php the_field('testimonial_occupation'); ?></h6>
                    </div>
                  <?php 
                    endwhile; 
                      endif; 
                        wp_reset_postdata(); 
                  ?>
                </div>
                <!-- Controls -->
                <a class="left" href="#carousel-example-generic" role="button" data-slide="prev">
                  <i class="fa fa-long-arrow-left" aria-hidden="true"></i>
                  <span class="sr-only">Previous</span>
                </a>
                <a class="right" href="#carousel-example-generic" role="button" data-slide="next">
                  <i class="fa fa-long-arrow-right" aria-hidden="true"></i>
                  <span class="sr-only">Next</span>
                </a>
              </div>
            </div>
        </div>
    </div>
</div>