Question

我已经完成了一个wordpress脚本，显示了制作此代码的缩略图帖子网格：

            <div class="col-sm-12 col-md-12" style="background-color: #ccc; padding-top: 30px;">
          <article <?php post_class( 'article' ); ?> id="post-<?php the_ID(); ?>">
            <?php
            $child_pages = new WP_Query( array(
                'post_type'      => 'page', // set the post type to page
                'posts_per_page' => 10, // number of posts (pages) to show
                'post_parent'    => 17, // enter the post ID of the parent page
                'no_found_rows'  => true, // no pagination necessary so improve efficiency of loop
                'order_by' => 'title',
                'order' => 'asc',
            ) );

            if ( $child_pages->have_posts() ) : while ( $child_pages->have_posts() ) : $child_pages->the_post();
            ?>
            <div class="col-md-6  thumbnail-frontpage clearfix">

              <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>

              <a href = "<?php the_permalink(); ?>" > <img src = "<?php echo $image[0]; ?>" onmouseover="this.src='<?php the_field('rollover_image'); ?> ' " onmouseout="this.src='<?php echo $image[0]; ?>'" /> <?php the_title(); ?> </a>

            </div>

            <?php

            endwhile;

            endif;

            wp_reset_postdata();

            ?>



                <!-- <p class=""><?php the_content( ); ?></p> -->


        </article>
        </div>

现在，我希望区分缩略图边框的颜色，将分数与均匀分开。如何在条件代码中使用它？

Answer 1

如果“边框颜色差异化”是你唯一的目的，我建议你使用CSS，而不是PHP。

.thumbnail-frontpage:nth-child( even ) {
    border: 1px solid red;
}

.thumbnail-frontpage:nth-child( odd ) {
    border: 1px solid blue;
}

您可以在此处查找：http://www.w3schools.com/cssref/sel_nth-child.asp

Answer 2

你想要这样

       <?php
         $child_pages = new WP_Query( array(
            'post_type'      => 'page', // set the post type to page
            'posts_per_page' => 10, // number of posts (pages) to show
            'post_parent'    => 17, // enter the post ID of the parent page
            'no_found_rows'  => true, // no pagination necessary so improve efficiency of loop
            'order_by' => 'title',
            'order' => 'asc',
        ) );
        $i=0;
        if ( $child_pages->have_posts() ) : while ( $child_pages->have_posts() ) : $child_pages->the_post();
        if($i%2==0){
            $thumbnail  = 'thumbnail'; 
        }else{
            $thumbnail  = 'single-post-thumbnail';
        }
        ?>
        <div class="col-md-6  thumbnail-frontpage clearfix">

          <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), $thumbnail ); ?>

          <a href = "<?php the_permalink(); ?>" > <img src = "<?php echo $image[0]; ?>" onmouseover="this.src='<?php the_field('rollover_image'); ?> ' " onmouseout="this.src='<?php echo $image[0]; ?>'" /> <?php the_title(); ?> </a>

        </div>

        <?php
        $i++;
        endwhile;

        endif;

        wp_reset_postdata();

        ?>



            <!-- <p class=""><?php the_content( ); ?></p> -->


    </article>
    </div>

Wordpress如何区分缩略图从偶数到奇数？

2 个答案: