Оформление записей в цикле wordpress?

Question

[Максим Максимов]

Здравствуйте уважаемые товарищи , подскажите пожалуйста ,
есть ли какие то другие варианты вывода постов в разном стиле на одной странице.

Нужно сделать такую страницу.

<?php
/*
Template Name: Мой шаблон Блог
*/
?>

<?php get_header();
?>

<div id="primary" class="blog-content-area">

	<main id="main" class="site-main main-news-post">
	<div class="container">
		<div class="news-posts">



			<!-- Первая строка -->
			<div class="news-post-one">


			<div class="big_title-post">

				<?php  $args_1 = array(
        'post_type' => 'post',
		'post_status' => 'publish',
		'order'=>'desc',
        'posts_per_page' => '1',
    );
	$my_post_1 = new WP_Query( $args_1 );
	?>

				<?php while ( $my_post_1->have_posts() ) : $my_post_1->the_post(); ?>

					<article id="post-<?php the_ID(); ?>" <?php post_class('one-b'); ?>>
						<a href="<?php the_permalink(); ?>">
							<div class="post-title-header">
								<?php the_title( '<h2 class="news-post-title">', '</h2>' ); ?>
							</div>
							<p class="news-post-data"><?php the_date('d-m-Y'); ?></p>
						</a>
					</article>

				</div>
				<?php endwhile ?>



				<div class="post-for-mini">
		<?php  $args_2 = array(
                'post_type' => 'post',
		'post_status' => 'publish',
		'order'=>'desc',
		'offset'=>'1',
               'posts_per_page' => '4',
                            );
	$my_post_2 = new WP_Query( $args_2 );
	?>
					<?php while ( $my_post_2->have_posts() ) : $my_post_2->the_post(); ?>

					<article id="post-<?php the_ID(); ?>" <?php post_class('one-b'); ?>>
						<a href="<?php the_permalink(); ?>">
							<div class="post-title-header">
								<?php the_title( '<h2 class="news-post-title">', '</h2>' ); ?>
							</div>
							<p class="news-post-data"><?php the_date('d-m-Y'); ?></p>
						</a>
					</article>

					<?php endwhile ?>
				</div>

			</div>

			<!-- Вторая строка -->

			<div class="news-post-two">
			<?php  $args_3 = array(
        'post_type' => 'post',
		'post_status' => 'publish',
		'order'=>'desc',
		'offset'=>'5',
        'posts_per_page' => '1',
        //'paged' => 1,
    );
	$my_post_3 = new WP_Query( $args_3 );
	?>
	<?php while ( $my_post_3->have_posts() ) : $my_post_3->the_post(); ?>
	<article id="post-<?php the_ID(); ?>" <?php post_class('two-b'); ?>>
	<a href="<?php the_permalink(); ?>">
	
	<div class="img-news-post">
	
		<?php echo kama_thumb_img('w=1600 &h=280 &crop=center/center'); ?>
	
		<div class="hews-post-header">
			<?php the_title( '<h2 class="news-post-title">', '</h2>' ); ?>
		</div>
		<p class="news-post-data"><?php the_date('d-m-Y'); ?></p>
	</div>
	</a>
	</article>
				<?php endwhile ?>
			</div>


			<!-- Третья строка -->

			<div class="news-post-tree">
		<?php  $args_4 = array(
        'post_type' => 'post',
		'post_status' => 'publish',
		'order'=>'desc',
		'offset'=>'6',
        'posts_per_page' => '3',
    );
	$my_post_4 = new WP_Query( $args_4 );
	?>
	<?php while ( $my_post_4->have_posts() ) : $my_post_4->the_post(); ?>
			
	<article id="post-<?php the_ID(); ?>" <?php post_class('tree-b'); ?>>
	 <a href="<?php the_permalink(); ?>">
<div class="hews-post-img">
<?php echo kama_thumb_img('w=400 &h=280 &crop=center/center'); ?>
</div>

	<div class="hews-post-header">
	<?php the_title( '<h2 class="news-post-title">', '</h2>' ); ?>
	</div>

	<p class="news-post-data"><?php the_date('d-m-Y'); ?></p></a>
</article>
<?php endwhile ?>

			</div>


			<div class="post_load_more">
			<div id='load-news-posts' class="loadmore-post">Следующие</div>
		</div>
		</div>


		<?php 
$args_с = array(
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => -1,
    );
   $num = count( get_posts( $args_с ) );

?>
		<div id="post-count">
			<?php echo $num; ?>
		</div>
		<div class="container">
	</main>
</div><!-- #primary -->


<?php
get_footer(); ?>

И еще проблема в моём случае , ДАТА ПОСТА выводится только в первом посте, а в остальных почему то нет.

Далее планируется просто ajax`ом подгружать остальные посты в виде последних трёх, по 3 штуки.

Answer 1

[poshta3005]

... а дата поста выводится только в первом посте потому, что в цикле вывода постов используется the_date()
А он выводит дату для группы постов, которые опубликованы в один день.

Замените the_date() на the_time() или выводите get_the_date() - и будет Вам счастье.

Answer 2

[Орхан Гасанлы]

Здравствуйте!
Конечно есть...
1) использовать счетчик, чтобы добавить стиль к определенной записи.
Например, вывести первую запись другого размера, а остальные одинакового...
2) использовать средства css в частности псевдоклассы nth-child(), last-child, first-child, чтобы стилизовать нужную вам запись в блоке определенным образом.

+ если у вас тема на бутстрапе, то можете готовые стили взять отсюда -
https://bootsnipp.com/search?q=post+grid

Comments

[MrMaximum]

С одной стороны вы говорите верно, но не для этого случая.
Здесь первые 5 постов находятся в одном родителе и в них не нужно выводить картинки (и загружать), во втором блоке где картинка во всю ширину страницы, там нужно загружать соответствующую картинку, а в третьем блоке грузят другие картинки. Не нужно грузить везде большие картинки и уменьшать их через css, так страница будет грузиться дольше, ну и не забываем про разных родителей для для блоков.

[Орхан Гасанлы]

MrMaximum, вполне возможно, спорить не буду)) Я не изучил его код, а предложил примерную реализацию.