构建一个循环,其中第一项与其余项不同

Building a Loop where first item appears different than the rest

我正在尝试构建一个循环,其中第一项与其余项不同。

下面是我目前写的代码。但是,第二个循环仍然显示第一个项目,所以我可能做错了什么。

<?php
    $book_ids = array(5, 7, 8, 12);

    $book_args = array(
        'post_type'      => 'book',
        'post_status'    => 'publish',
        'posts_per_page' => 4,
        'post__in'       => $book_ids,
        'orderby'        => 'post__in'
    );

    $book_loop = new WP_Query( $book_args );

    // Check if there are any posts that match the query
    if ( $book_loop->have_posts() ) :
        // Initialize the post counter
        $book_featured = 0;
?>
    <div class="library__featured-books">
        <div class="featured-books__wrapper">
            <div class="featured-books__primary">
                <!-- Begin first item loop -->
                <?php
                    // If there are posts matching the query then start the loop
                    while ( $book_loop->have_posts() ) : $book_loop->the_post();

                        if ( $book_featured == 0 ) :
                ?>
                    <div class="book-card">
                        <a href="<?php the_permalink(); ?>" class="book-card__link">
                            <div class="book-card__image">
                                <img src="<?php echo get_the_post_thumbnail( get_the_ID(), 'full' ); ?>" alt="" />
                            </div>
                            <div class="book-card__caption">
                                <div class="caption__wrapper">
                                    <h3 class="caption__title"><?php the_title(); ?></h3>

                                    <?php the_excerpt(); ?>
                                </div>
                            </div>
                        </a>
                    </div>
                <?php
                        endif;

                        // Add 1 to the post counter
                        $book_featured++;
                    // Stop the loop when all posts are displayed
                    endwhile;
                ?>
                <!-- End first item loop -->
            </div>

            <div class="featured-books__secondary">
                <div class="secondary__wrapper">
                    <!-- Begin loop of remaining items -->
                    <?php
                        // If there are posts matching the query then start the loop
                        while ( $book_loop->have_posts() ) : $book_loop->the_post();

                            if ( $book_featured >= 2 ) :
                    ?>
                        <div class="seconardary__block">
                            <div class="book-card">
                                <a href="<?php the_permalink(); ?>" class="book-card__link">
                                    <div class="book-card__image">
                                        <img src="<?php echo get_the_post_thumbnail( get_the_ID(), 'full' ); ?>" alt="" />
                                    </div>
                                    <div class="book-card__wrapper">
                                        <div class="book-card__caption">
                                            <h3 class="caption__title"><?php the_title(); ?></h3>
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    <?php
                            endif;

                            // Add 1 to the post counter
                            $book_featured++;
                        // Stop the loop when all posts are displayed
                        endwhile;
                    ?>
                    <!-- End loop of remaining items -->
                </div>
            </div>
        </div>
    </div>
<?php
    endif;
    wp_reset_postdata();
?>

对于这个例子,我使用了两个循环。如果可能,请随时对此进行改进。非常感谢任何帮助。

你可以试试下面的代码:

 <?php
    $book_ids = array(5, 7, 8, 12);

    $book_args = array(
        'post_type'      => 'book',
        'post_status'    => 'publish',
        'posts_per_page' => 4,
        'post__in'       => $book_ids,
        'orderby'        => 'post__in'
    );

    $book_loop = new WP_Query( $book_args );

     // Check if there are any posts that match the query
        if ( $book_loop->have_posts() ) :
            // Initialize the post counter
            $book_featured = 0;
    ?>
        <div class="library__featured-books">
            <div class="featured-books__wrapper">
                <div class="featured-books__primary">
                    <!-- Begin first item loop -->
                    <?php
                        // If there are posts matching the query then start the loop
                         while ( $book_loop->have_posts() ) : $book_loop->the_post();

                        if ( $book_featured == 0 ) :
                ?>
                    <div class="book-card">
                        <a href="<?php the_permalink(); ?>" class="book-card__link">
                            <div class="book-card__image">
                                <img src="<?php echo get_the_post_thumbnail( get_the_ID(), 'full' ); ?>" alt="" />
                            </div>
                            <div class="book-card__caption">
                                <div class="caption__wrapper">
                                    <h3 class="caption__title"><?php the_title(); ?></h3>

                                    <?php the_excerpt(); ?>
                                </div>
                            </div>
                        </a>
                    </div>
                <?php
                        endif;

                        // Add 1 to the post counter
                        $book_featured++;
                    // Stop the loop when all posts are displayed
                    endwhile;
                ?>
                <!-- End first item loop -->
            </div>

            <div class="featured-books__secondary">
                <div class="secondary__wrapper">
                    <!-- Begin loop of remaining items -->
                    <?php
                    //reset the value on the variable
                       $book_featured = 0; 
                       // the query then start the loop
                        while ( $book_loop->have_posts() ) : $book_loop->the_post();
                         if ( $book_featured >= 1 ) :
                    ?>
                        <div class="seconardary__block">
                            <div class="book-card">
                                <a href="<?php the_permalink(); ?>" class="book-card__link">
                                    <div class="book-card__image">
                                        <img src="<?php echo get_the_post_thumbnail( get_the_ID(), 'full' ); ?>" alt="" />
                                    </div>
                                    <div class="book-card__wrapper">
                                        <div class="book-card__caption">
                                            <h3 class="caption__title"><?php the_title(); ?></h3>
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    <?php
                      endif;
                      // Add 1 to the post counter
                      $book_featured++;
                      // Stop the loop when all posts are displayed
                      endwhile;
                    ?>
                    <!-- End loop of remaining items -->
                </div>
            </div>
        </div>
    </div>
<?php
    endif;
    wp_reset_postdata();
?>