Wp default loop break?

Question

[Miqo58]

<div class="container">
	<div class="row">
		 <div class="col-md-8">
	 	<?php
		$arguments = array(
		'post_type'	=> 'post',
		'posts_per_page' => 5
		); 

		$query = new WP_Query( $arguments ); ?>
		 	
 			
			<div class="row">

				<?php $i = 0; while ( $query->have_posts() && $i++ < 1 ) : $query->the_post(); ?>
				 	<div class="col-md-6 STYLE-1 (for 1 post)">
				 		 <?php the_title(); ?>
				 	</div>
				<?php endwhile; wp_reset_postdata(); ?>
			
		 		<div class="col-md-3 STYLE-2 (for 2 post)">
	 			<?php $i = 0; while ( $query->have_posts() && $i++ < 2 ) : $query->the_post();  
			 		 <?php the_title(); ?>
	 			<?php endwhile; wp_reset_postdata(); ?>
			 	</div>
		
				<div class="col-md-3 STYLE-3 (for 3 post)">
					<?php $i = 0; while ( $query->have_posts() && $i++ < 5 ) : $query->the_post(); ?>
				 		 <?php the_title(); ?>
		 			<?php endwhile; wp_reset_postdata(); ?>
			 	</div>
		
			</div>
 
		<?php wp_reset_postdata(); ?>
		</div>
		<div class="col-md-4"></div>
	</div>
</div>

Comments

[Miqo58]

Можно ли использовать такой цикл wp, или что предложите лучше для стилизации разных постов к примеру

[Модератор]

Miqo58, не стоит писать комментарии к ответам в ответах

Answer 1

[Игорь Воротнёв]

Во-первых, переменная $i вам не нужна, у объекта WP_Query есть свойство $query->current_post.

Во-вторых, не нужно делать каждый раз wp_reset_postdata() и продолжать цикл, достаточного одного стандартного цикла while( have_posts() ), а внутри if.

В третьих, у вас в целом разметка одинаковая, отличаются только классы / стили. Поэтому вашу задачу в принципе можно решить чисто на CSS. Но если все же хотите задействовать PHP, то будет что-то типа такого:

$arguments = [
    'posts_per_page' => 5
]; 

$query = new WP_Query( $arguments ); ?>

<div class="row">

<?php 
// Обычный WordPress Loop:
while ( $query->have_posts() ) : $query->the_post();

    // Можно ограничиться одним кастомным классом с индексом:
    echo "<div class=\"custom-post-style-{$query->current_post}\">";

   ...

endwhile; ?>

</div>

Comments

[Miqo58]

Спасибо большое за отзыв

[Miqo58]

А как добавить классы к примеру
.row
.col-md-6 (1-пост)
.col-md-3 (2-постa)
.col-md-3 (2-постa)

[Игорь Воротнёв]

Miqo58,

echo $query->current_post === 1 ? '.col-md-6' : '.col-md-3';

[Miqo58]

Игорь Воротнёв,
Спасибо большое

Answer 2

[Alex]

В вашем случае, как я понимаю, достаточно применять CSS grid для стилизации постов. И самый простой цикл.

Comments

[Miqo58]

Спасибо за отзыв
А когда лучше применять ?

[Miqo58]

И как добавить классы в таком случае .row>..col-md-6>.col-3*2

<?php
		if ( have_posts() ) :

			/* Start the Loop */
			while ( have_posts() ) :
				the_post();

				/*
				 * Include the Post-Type-specific template for the content.
				 * If you want to override this in a child theme, then include a file
				 * called content-___.php (where ___ is the Post Type name) and that will be used instead.
				 */
				get_template_part( 'template-parts/content', get_post_format() );

			endwhile;

			the_posts_navigation();

		else :

			get_template_part( 'template-parts/content', 'none' );

		endif;
		?>

[Miqo58]

А как добавить классы к примеру
.row
.col-md-6 (1-пост)
.col-md-3 (2-постa)
.col-md-3 (2-постa)