如何创建一个循环,其中循环每个帖子都会改变?

时间:2016-04-08 作者:Wordpress Student

我如何在WordPress中创建一种循环类型,其中图像在每篇文章中向左或向右移动?一、 e.第一个帖子图像将向左,第二个帖子图像将向右,第三个帖子图像将向左,依此类推。。。

2 个回复
SO网友:Milo

PHP模数运算符提供了除以2个数字的余数。任何数字除以2的余数是0或1,因此我们可以使用它来提供“交流发电机”。我们使用current_post var作为计数器,可在任何WP_Query 对象:

while( have_posts() ){
    the_post();

    if( $wp_query->current_post % 2 ){
        echo \'right\';
    } else {
        echo \'left\';
    }

}

SO网友:Wordpress Student

非常感谢你。问题已解决。这是我的密码。

<section id="features">
    <div class="container">
        <div class="row">
        <?php $args = array(
            \'post_type\' => \'service\',
            \'posts_per_page\' => 4
        );
        $service = new WP_Query($args);
        while ( $service->have_posts() ) : $service->the_post(); 
        ?>
            <?php if($service->current_post % 2) : ?>
             <div class="single-features" id="post-<?php the_ID(); ?>"<?php post_class(\'my-class\'); ?>>

                <div class="col-sm-5 wow fadeInLeft imagePosition" data-wow-duration="500ms" data-wow-delay="300ms">
                    <?php the_post_thumbnail(); ?>
                </div>
                <div class="col-sm-6 wow fadeInRight textPosition" data-wow-duration="500ms" data-wow-delay="300ms">
                    <h2><?php the_title(); ?></h2>
                    <P> <?php the_content(); ?></P>
                </div>
            </div>
            <?php else : ?>

             <div class="single-features">
                <div class="col-sm-6 col-sm-offset-1 align-right wow fadeInLeft" data-wow-duration="500ms" data-wow-delay="300ms">
                    <h2><?php the_title(); ?></h2>
                    <P><?php the_content(); ?></P>
                </div>
                <div class="col-sm-5 wow fadeInRight" data-wow-duration="500ms" data-wow-delay="300ms">
                    <?php the_post_thumbnail(); ?>
                </div>
            </div>
    <?php endif; ?>
        <?php endwhile; ?>
            <!-- Do other stuff... -->

        </div>
    </div>
</section>
 <!--/#features-->