Как реализовать такой слайдер на Wordpress?

Question

[freeman0204]

Вот код слайдера https://jsfiddle.net/sk0fntoy/. Должно быть 4 слайда, в одном слайдер 3 блока. Один слева большой и 2 справа поменьше. Это видно по структуре верстки. Нужно вывести максимум 12 постов, т.е. будет 4 слайда и в каждом по 3 блока. Если просто все взять в цикл то выводит на одном слайде одинаковые посты и слайдов 12 штук, потому что так указано здесь 'posts_per_page' => 12. Как я понял нужно завести переменную, например i и разделить ее на 3 и в конце сбросить, как то так. Но у меня не выходит. В коде это все есть. Что мне там нужно поправить что бы в каждом слайде выводилось по 3 блока и в каждом блоке был свой пост?

Answer 1

[Игорь Воротнёв]

Неужели так сложно воспользоваться поиском?

Как обернуть дивом каждые 3 записи?

Comments

[freeman0204]

https://jsfiddle.net/m4bjxvwt/ Теперь 4 слайда как и надо но в каждом блоке одного слайде один и тот же пост. Как это можно исправить?

[Игорь Воротнёв]

freeman0204, в if необходимо оборачивать только div (в который будут попадать нужные посты), а не весь вывод.

[freeman0204]

Игорь Воротнёв, тогда вообще ничего не выходит. Можете показать на примере моего кода на
https://jsfiddle.net ?

[Игорь Воротнёв]

freeman0204,

<section class="slider">
    <div class="container">
        <div class="row">
            <div class="col">
                <div class="slider_head">
                
                    <?php
                    $args = [
                      'post_type' => 'post',
                      'posts_per_page' => 12,
                      'order' => 'ASC',
                    ];
                    
                    $query = new WP_Query( $args );
                    
                    if ( $query->have_posts() ) :

                      while ( $query->have_posts() ) : $query->the_post();
                      
                        $current = $query->current_post + 1;
                        
                        // Открываем обертку только каждую 3ю итерацию
                        if ($current % 3 === 0) : ?>
                            <div>
                        <?php endif; ?>

                          <!-- А вот тут стандартный вывод одного поста -->
                          
                          <article>
                            <h1><?php the_title(); ?></h1>
                            <?php the_content(); ?>
                          </article>

                        <?php
                        // И закрывает обертку, тоже каждую третью итерацию
                        if ($current % 3 === 0) : ?>
                          </div>                            
                        <?php endif; ?>


                      <?php endwhile; ?>
                      
                    <?php endif; ?>
                     <?php wp_reset_postdata(); ?>
                     
                </div>
            </div>
        </div>
    </div>
</section>