Как сделать последнюю запись с собственным стилем?

Question

[Константин]

Всем привет.
Как сделать вывод записей так, чтобы последняя запись имела отличающийся стиль?
как на фото


Может есть где документация или примеры?
я в wp новичок...

Answer 1

[Lord_Dantes]

Для этого вам нужно составить цикл, при котором (исходя из скриншота), вам нужно публикоать 2 записи - 1 шаблоном, а 1 запись - 2-им шаблоном.

И собственно создать 2 шаблона. В первую очередь это нужно реализовать в верстке, потом в вп.

Comments

[Константин]

Верстка есть. Пока вывожу в одном стиле.

как сейчас

<div class="right_block narrow_Y">
								<div class="front_projects_3">
									<div class="news_block item-views table-elements portfolio">
										<div class="items row flexbox ajax_load">

                    <?php 
                      // параметры по умолчанию
                      $posts = get_posts( array(
                        'numberposts' => 0,
                        'category_name'    => $cat_slug,
                        'orderby'     => 'date',
                        'order'       => 'DESC',
                        'include'     => array(),
                        'exclude'     => array(),
                        'meta_key'    => '',
                        'meta_value'  =>'',
                        'post_type'   => 'post',
                        'suppress_filters' => true, // подавление работы фильтров изменения SQL запроса
                      ) );

                      foreach( $posts as $post ){
                        setup_postdata($post);
                          ?> 
                          
                      <div class="col-md-4 col-sm-6 col-xs-12">
												<div class="item sliced ">
													<div class="img image shine">
														<div class="img bg-pos-c wdt-100 hght-100"
															style="background:url(<?php the_post_thumbnail_url(); ?>) no-repeat;background-size:cover"
                              alt="<?php the_title(); ?>">
                              <a class="all_prnt_block" href="<?php the_permalink(); ?>"></a></div>
													</div>
													<div class="date color-777 fs-13"><?php echo get_the_date(); ?></div>
													<div class="info">
														<div class="sticker-block"> <?php echo $cat_name ?> </div>
                            <a class="name option-bold fs-17 color-333 lh-135 color-theme-hover m-b-16" href="<?php the_permalink(); ?>">
                              <?php the_title(); ?>
                            </a>
														<div class="text">
															<?php the_excerpt(); ?>
														</div>
													</div>
												</div>
                      </div>

                          <?php
                      }
                      wp_reset_postdata(); // сброс ?>

											
                      
										</div>
									</div>
								</div>
							</div>

Вот сама верстка, как по идее нужно реализовать.

код

<div class="col-md-12">
							<div >
								<div class="front_projects_4">
									<div class="news_block item-views table-elements blocks portfolio">
										<div class="title_block">
											<a href="/articles/" class="right_link_block">Все кухни</a>
											<h3 class=" option-bold-700">Последние кухни</h3>
										</div>
										<div class="items row flexbox">
											<div class="col-md-6 col-sm-12 col-xs-12 custom">
												<div id="bx_2970353375_1964" class="item sliced big ">
													<div class="img image shine big_image">
														<a href="/articles/bezopasnost-i-komfort-v-dome/ochistka-vody-ot-radona-i-ego-opasnost/">
															<div class="dark_hover"></div>
															<div class="img bg-no-rep bg-size-cover hght-100 bg-pos-c"
																style="background-image:url(http://kuhnimarket.su/assets/images/resources/60/bech680vxpc.jpg)"></div>
															<div class="info">
																<div class="sticker-block">
																	Безопасность и комфорт в доме </div>
																<div class="name dark_link option-bold">Очистка воды от радона и его опасность</div>
																<div class="text">
																	<p>
																		Чистая питьевая вода – важное условие существования человека. Прежде чем попасть на стол, ее
																		очищают разными способами от примесей, в том числе и от радиоактивного инертного газа
																		радона.
																	</p>
																</div>
																<div class="date color-777 fs-13">9 Февраля 2019</div>
															</div>
														</a>
													</div>
												</div>
											</div>

											<div class="col-md-3 col-sm-6 col-xs-12 custom">
												<div id="bx_2970353375_1967" class="item sliced  with_date">
													<div class="img image shine">
														<a href="/articles/metalloobrabotka/kak-pravilno-vybrat-konditsioner/">
															<div class="img bg-no-rep bg-size-cover bg-pos-c"
																style="background-image:url(http://kuhnimarket.su/assets/images/resources/417/alejna.jpg)"></div>
														</a>
													</div>
													<div class="info">
														<div class="sticker-block">
															Практические советы </div>
														<a class="name dark_link option-bold"
															href="/articles/metalloobrabotka/kak-pravilno-vybrat-konditsioner/">Как правильно выбрать
															кондиционер</a>
														<div class="date color-777 fs-13">27 Мая 2019</div>
													</div>
												</div>
											</div>

											<div class="col-md-3 col-sm-6 col-xs-12 custom">
												<div id="bx_2970353375_1966" class="item sliced  with_date">
													<div class="img image shine">
														<a href="/articles/povyshenie-prodazh/septik-topas/">
															<div class="img bg-no-rep bg-size-cover bg-pos-c"
																style="background-image:url(/upload/iblock/27b/27b3152ae0f2958fecdc784d0c73cd00.jpg)"></div>
														</a>
													</div>
													<div class="info">
														<div class="sticker-block">
															Обзоры </div>
														<a class="name dark_link option-bold" href="/articles/povyshenie-prodazh/septik-topas/">Особенности
															септика «Топас»</a>
														<div class="date color-777 fs-13">27 Июня 2019</div>
													</div>
												</div>
											</div>

										</div>
									</div>
								</div>
							</div>
						</div>