• Wordpress цикл bootstrap grid?

    HeadOnFire
    @HeadOnFire
    PHP, Laravel & WordPress Evangelist
    Давайте уже закроем этот вопрос. Несколько моментов:

    1. Не нужно запускать цикл несколько раз, все условия проверяются внутри одного цикла.
    2. Свойство $query->current_post проверяем внутри цикла, счетчик начинается с 0.

    <div class="container">
    	<div class="row">
    
    		<?php
    		$args = [
    			'post_status'            => 'publish',
    			'posts_per_page'         => 5,
    			'no_found_rows'          => true,
    			'cache_results'          => true,
    			'update_post_meta_cache' => false,
    			'update_post_term_cache' => false,
    		];
    		$query = new WP_Query( $args );
    
    		while ( $query->have_posts() ) : $query->the_post();
    
    			// 1я запись, целиком в .col-6
    			if ( $query->current_post === 0 )
    			{
    				echo '<div class="col-6">'; // Открыли .col-6
    					echo '<div class="post-card">';
    						the_post_thumbnail( 'custom-size', [ 'class' => 'img-fluid' ] );
    						the_title();
    					echo '</div>';
    				echo '</div>'; // Закрыли .col-6
    			}
    
    			// 2я и 4я записи, только открываем .col-3 и выводим 1 запись
    			if ( $query->current_post === 1 || $query->current_post === 3 )
    			{
    				echo '<div class="col-3">'; // Открыли .col-3
    					echo '<div class="post-card">';
    						the_post_thumbnail( 'custom-size', [ 'class' => 'img-fluid' ] );
    						the_title();
    					echo '</div>';
    			}
    
    			// 3я и 5я записи, выводим запись и закрываем .col-3
    			if ( $query->current_post === 2 || $query->current_post === 4 )
    			{
    					echo '<div class="post-card">';
    						the_post_thumbnail( 'custom-size', [ 'class' => 'img-fluid' ] );
    						the_title();
    					echo '</div>';
    				echo '</div>'; // Закрыли .col-3
    			}
    
    		endwhile; ?>
    
    	</div>
    </div>


    Данный код выведет вот такой HTML:

    <div class="row">
    	<div class="col-6">
    		<div class="post-card">
    			...
    		</div>
    	</div>
    
    	<div class="col-3">
    		<div class="post-card">
    			...
    		</div>
    
    		<div class="post-card">
    			...
    		</div>
    	</div>
    
    	<div class="col-3">
    		<div class="post-card">
    			...
    		</div>
    
    		<div class="post-card">
    			...
    		</div>
    	</div>
    </div>


    Но, важно понимать порядок постов в колонках .col-3 - он будет таким:

    .col-6      .col-3      .col-3
    ------      ------      ------
    post-1      post-2      post-4
                post-3      post-5


    а не вот таким:

    .col-6      .col-3      .col-3
    ------      ------      ------
    post-1      post-2      post-3
                post-4      post-5


    В принципе, еще есть другой путь:

    - Посты получаете через get_posts() в виде массива объектов WP_Post.
    - HTML генерите без цикла, формируете как вам надо.
    - В нужных местах подставляете нужный объект WP_Post по его индексу в массиве.
    Ответ написан
    5 комментариев
  • Wp default loop break?

    HeadOnFire
    @HeadOnFire
    PHP, Laravel & WordPress Evangelist
    Во-первых, переменная $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>
    Ответ написан
    4 комментария
  • Wp default loop break?

    Kozack
    @Kozack Куратор тега WordPress
    Thinking about a11y
    В вашем случае, как я понимаю, достаточно применять CSS grid для стилизации постов. И самый простой цикл.
    Ответ написан
    3 комментария
  • Страницы wordpress?

    HeadOnFire
    @HeadOnFire
    PHP, Laravel & WordPress Evangelist
    Для терминов разного типа нужно создавать отдельную таксономию. Как дефолтные теги и категории. В вашем случае:
    - Таксономия 1 - страны
    - Таксономия 2 - другие термины (Природа, Развлечения и тд)
    Ответ написан
    2 комментария