Добрый день.
Я уже пол задачи решил, осталось добавить автоматики.
Есть контейнер, в котором есть неисчерпаемое количество элементов.
В одном ряду помещаются по 3 элемента.
Для первого ряда задается класс 'fadeInRight', для второго 'fadeInLeft' и потом для 3 ряда опять 'fadeInRight'.
Никаких оберток для рядов создавать не нужно, так как контейнеру задал свойство grid.
Вот как мне удалось решить эту задачу
<div class="auto">
<?php $i = 1; while($auto->have_posts()): ?>
<?php
$auto->the_post();
$content = get_the_content();
?>
<div class="auto__item wow <?php echo (( $i > 0 && $i < 4 ) || ($i > 6 && $i < 10) || ($i > 12 && $i < 16)) ? 'fadeInLeft' : 'fadeInRight'; ?>">
<?php the_post_thumbnail('full'); ?>
<h3><?php the_title(); ?></h3>
<p><?php echo wp_trim_words($content); ?></p>
<a href="<?php the_permalink(); ?>" class="btn">Read more</a>
</div>
<?php $i++; endwhile; ?>
</div>
Понятно, что я не могу вечно высчитывать и прописывать
( $i > 0 && $i < 4 )
Закономерность одна, что i кратен 6.
Я не так силен в математике.
Проект тестовый, увидел плагин
isotope на jquery, и захотелось применить, но столкнулся с данной проблемой
Заранее буду благодарен за подсказку.