Как выводить посты с разными стилями и разметкой в wordpress?

Question

Не могу понять как выводить блог-посты с разной разметкой и стилями. То-есть задача такая, чтобы первый пост выводился крупный, а остальные два мелких.

Написал такой код:

<?php
               $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
               $args = array(
                   'posts_per_page' => 10,
                   'order'          => 'ASC',
                   'post_type'      => 'blog',
                   'paged'          => $paged
               );
               $loop = new WP_Query( $args );
               ?>
               <?php
               if( $loop->have_posts() ) {
                   while( $loop->have_posts() ){
                       $loop->the_post();
                       ?>

                       <div class="col-lg-5">
                           <div class="single-blog__item blog-large">
                               
                           </div>
                       </div>

                       <div class="col-lg-7">

                           <div class="single-blog__item blog-small">
                               
                           </div>

                           <div class="single-blog__item blog-small">
                               
                           </div>

                       </div>

                       <?php

                   }
                   wp_reset_postdata();

               }

               ?>

Answer 1

Можно использовать переменную-счётчик и проверять - если это первый пост, то одна разметка, если не первый - другая:

if( $loop->have_posts() ) {
  $i = 0; //вводим переменную-счётчик
  while( $loop->have_posts() ){
    $loop->the_post();
    if($i == 0) {
       //здесь первый большой пост
    }
    else {
       //здесь остальные посты
    }
    $i++ //не забываем инкрементировать счётчик
  }
}

Answer 2

если я правильно понял как должен выглядеть ваш темплейт, то должно быть вот так

    if( $loop->have_posts() ) {
        while( $loop->have_posts() ) {
            $loop->the_post();

            if ( $loop->current_post === 0 ) :
                ?>
                <div class="col-lg-5">
                    <div class="single-blog__item blog-large">
                        <?php the_title(); ?>
                    </div>
                </div>
                <?php
                continue;
            endif; ?>

            <?php if ( $loop->current_post === 1 ) : ?>
                <div class="col-lg-7">
            <?php endif; ?>

                <div class="single-blog__item blog-small">
                    <?php the_title(); ?>
                </div>

            <?php if ( $loop->post_count === $loop->current_post + 1 ) : ?>
                </div>
            <?php endif;
        }

        wp_reset_postdata();
    }

БЛОГ НА HUSL

Как выводить посты с разными стилями и разметкой в wordpress?

Ответы (2 шт):