Задать вопрос
@akf_13rm

Wordpress. Как вывести архив постов в две колонки с разной разметкой?

Здравствуйте!
Есть архив блога, который я пытаюсь вывести в две колонки с разной разметкой:

6159577c3af87313406106.png

Первый пост добавляется в первую колонку, второй во вторую, третий в первую и т.д.

Решил использовать такой подход:
<?php if (have_posts()) : ?>
        		<?php while (have_posts()) : the_post(); ?>
        			<?php if ($wp_query->current_post % 2) :  ?>
        				<?php get_template_part('loop-blog-center'); ?><?php else: ?>
        				<?php get_template_part('loop-blog-right'); ?>
        			<?php endif; ?>
        		<?php endwhile; ?><?php endif; ?>


Где, loop-blog-center.php:
<article class="article_blog">
                <ul id="ajax-posts2" class="list_article_blog">

	                <?php
	                $args = array(
		                'post_type' => 'post',
		                'posts_per_page' => -1,
	                );

	                $loop = new WP_Query($args);

	                while ($loop->have_posts()) : $loop->the_post();
		                ?>

                        <li>
                            <a href="<?php the_permalink(); ?>" class="link_article_blog">
				                <?php echo get_the_post_thumbnail(get_the_ID()); ?>
                                <div class="item_text_list_article_blog">
					                <?php $cats = get_the_category($id); ?>
                                    <p class="division_ar_bl"><?php echo $cats[0]->name; ?></p>
                                    <div class="text_list_article_blog">
                                        <h3 class="title_list_article_blog"><?php the_title(); ?></h3>
                                        <p class="sub_title_list_article_blog"><?php echo carbon_get_post_meta( get_the_ID(),'post_subtitle' ); ?></p>
                                    </div>
                                </div>
                            </a>
                        </li>

	                <?php
	                endwhile;
	                wp_reset_postdata();
	                ?>

                </ul>
            </article>


loop-blog-right.php:
<div class="item_news_blog">
	<ul class="list_news_blog img_width">
		<?php

		$args = array(
			'post_type' => 'post',
			'posts_per_page' => -1,
		);

		$loop = new WP_Query($args);

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

				<li>
					<a href="<?php the_permalink(); ?>"><?php echo get_the_post_thumbnail(get_the_ID()); ?></a>
					<?php $cats = get_the_category($id); ?>
					<a class="rublic_news_blog" href="<?php get_category_link( $cats ); ?>"><?php echo $cats[0]->name; ?></a>
					<h3 class="title_news_blog"><a href="<?php the_permalink(); ?>"><?php the_title(); ?> <span><?php echo carbon_get_post_meta( get_the_ID(),'post_subtitle' ); ?></span></a></h3>
				</li>

			<?php }
		}

		wp_reset_postdata(); ?>
	</ul>
</div>


Но в таком случае, выводятся 4 колонки:
6159605f0d8bd689921288.png

Может кто сталкивался с подобным, как правильно вывести в две колонки, когда разметка принципиально отличается..
  • Вопрос задан
  • 146 просмотров
Подписаться 3 Средний 2 комментария
Помогут разобраться в теме Все курсы
  • Skillfactory
    Профессия Fullstack веб-разработчик на JavaScript и PHP
    20 месяцев
    Далее
  • Хекслет
    PHP-разработчик
    10 месяцев
    Далее
  • Нетология
    Веб-разработчик с нуля: профессия с выбором специализации
    14 месяцев
    Далее
Решения вопроса 1
ikonkov
@ikonkov
Tут проще сделать 2 цикла в двух колонках, в первой выбирать все нечетные, во второй все четные.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
artzolin
@artzolin Куратор тега WordPress
php, WordPress разработка сайтов artzolin.ru
Я для подобных сеток не долго думая беру masonry

PS. Вам надо было указывать тег CSS, там любят решать подобные задачки
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
FoodSoul Калининград
от 180 000 до 250 000 ₽
IT-Spirit Москва
от 230 000 до 320 000 ₽
от 200 000 до 290 000 ₽