Intereting Posts
Размеры изображения такие же, как размер изображения Как заставить WP использовать https для доступа к wordpress.org? Добавление кода в голову на все страницы вручную Образцы изображений в медиа-галерее вместо ID на WP API Response Отфильтровать поле имени пользователя при регистрации для профанации и нежелательных слов Loop не исключает указанную категорию на главной странице Расширенное настраиваемое логическое значение поля в пользовательском типе сообщения Как изменить цветную тему за сообщение? Автоматически добавлять простые пользовательские кнопки для печати, Facebook share и Tweet в сообщениях Можно ли включить поле «Ссылка на» в разделе «Настройки отображения вложений» для избранного изображения? Добавленные комментарии, но они отображаются выше содержания, а не ниже Как я могу сделать свои «неудачные запросы» в диаграммах и анализе Application Insights? Начальное значение wp_dropdown_categories При загрузке JPEG-файлов WordPress сжавает исходное изображение? Многосетевые таблицы такие же, как и Single Install?

Последние 5 сообщений (пользовательский тип сообщения), каждый пост по-разному CSS

При создании нашего портфолио я хотел бы сделать динамический заголовок с последними 5/6 цветными изображениями в строке. Все эти сообщения выходят из настраиваемого типа сообщений «apps».

<div id="header"> <div class="latest_post"> <img src="featured image" class="class-name" /></div> <div class="second_post"> <img src="featured image" class="class-name" /> </div> <div class="third_post"> <img src="featured image" class="class-name" /> </div> <div class="fourth_post"> <img src="featured image" class="class-name" /> </div> <div class="fifth_post"> <img src="featured image" class="class-name" /> </div> </div> 

Как мне создать что-то подобное?

Заранее спасибо.

Сначала настройте WP_Query для получения последних 5 сообщений из ваших пользовательских типов сообщений. Вам также необходимо обновить «счетчик» для каждого сообщения в цикле. Затем просто эхо счетчик в классе для div.

 <?php //Query posts $query = new WP_Query(array( 'post_type' => 'apps', 'posts_per_page' => 5 )); //Reset counter $count = 0; ?> <?php if ($query->have_posts()) : ?> <div id="header"> <?php while ($query->have_posts()) : $query->the_post(); ?> <?php $count++; //update count ?> <div class="post_<?php echo $count; //prints the class as "post_XX" ?>"> <?php if( has_post_thumbnail() ) { the_post_thumbnail(); } ?> </div> <?php endwhile; ?> </div> <?php endif; ?> <?php wp_reset_query(); ?> 

Это должно вернуть результаты в виде

 <div class="post_1"><img src=".." /></div> <div class="post_2"><img src=".." /></div> <div class="post_3"><img src=".." /></div> <div class="post_4"><img src=".." /></div> <div class="post_5"><img src=".." /></div> 

один вторичный цикл с WP_Query() ; используйте счетчик циклов $query->current_post для вывода этих пяти классов css из массива;

пример (на основе кода jzatt):

 <?php $query = new WP_Query(array( 'post_type' => 'apps', 'posts_per_page' => 5, 'meta_key' => '_thumbnail_id' )); $css_classes = array( 'latest', 'second', 'third', 'fourth', 'fifth' ); ?> <?php if ($query->have_posts()) : ?> <div id="header"> <?php while ($query->have_posts()) : $query->the_post(); ?> <div class="<?php echo $css_classes[$query->current_post%5]; ?>_post"> <?php the_post_thumbnail('thumbnail',array('class' => 'class-name' )); ?> </div> <?php endwhile; ?> </div> <?php endif; wp_reset_postdata(); ?> 

отрегулируйте 'thumbnail' на ваш размер изображения; для 6 сообщений, измените на posts_per_page' => 6, добавьте еще один 'sixth' элемент в массив классов css и измените $query->current_post%5 на $query->current_post%6