Для настройки карусели в WordPress при добавлении нового типа поста с классами Bootstrap (active), вам потребуется следовать нескольким шагам:
1. Создание нового типа поста в WordPress:
- Для создания нового типа поста в WordPress вы можете использовать функцию register_post_type
. Например:
function custom_post_type() { $args = array( 'public' => true, 'label' => 'Custom Posts', 'supports' => array( 'title', 'editor', 'thumbnail' ), 'rewrite' => array('slug' => 'custom-posts'), ); register_post_type( 'custom_post', $args ); } add_action( 'init', 'custom_post_type' );
2. Создание шаблона для вывода карусели:
- Создайте шаблон для вашего нового типа поста (например, single-custom_post.php
) и включите в него код для вывода карусели, например, используя Bootstrap. Например:
<div id="carouselExample" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <?php $args = array( 'post_type' => 'custom_post', 'posts_per_page' => -1 ); $query = new WP_Query( $args ); $count = 0; while ( $query->have_posts() ) : $query->the_post(); $active = ($count == 0) ? 'active' : ''; ?> <div class="carousel-item <?php echo $active; ?>"> <!-- Your carousel item content here --> <h3><?php the_title(); ?></h3> <div class="carousel-caption d-none d-md-block"> <?php the_content(); ?> </div> </div> <?php $count++; endwhile; wp_reset_postdata(); ?> </div> <a class="carousel-control-prev" href="#carouselExample" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#carouselExample" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div>
3. Добавление класса 'active' к первому слайду:
- В приведенном выше примере кода, переменная $active
определяет, должен ли быть присвоен класс 'active' текущему слайду. При выводе первого слайда мы присваиваем ему класс 'active'.
Дополнительно, вы можете настроить карусель с помощью дополнительных параметров Bootstrap, таких как интервал автопрокрутки и т.д.
Теперь при просмотре страницы вашего нового типа поста в WordPress, вы увидите карусель с добавленным классом 'active' к первому слайду. Не забудьте добавить стили CSS для вашей карусели в соответствии с шаблоном вашей темы WordPress.