Question

我正在使用Twitter Bootstrap构建WP主题。我想使用旋转木马，但我没有运气让幻灯片改变。我希望你们能帮助我。我似乎无法找出为什么这不起作用。

这是我的sidebar_carousel.php

<ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class=""></li>
    <li class="active" data-target="#myCarousel" data-slide-to="1"></li>
    <li class="" data-target="#myCarousel" data-slide-to="2"></li>
</ol>

<div class="carousel-inner">
    <?php
    $i = 1;
    $the_query = new WP_Query(array(
        'post_type' => 'ss_carousel',
        'posts_per_page' => 3
    ));
    while ($the_query->have_posts()) :
        $the_query->the_post();
        if ($i == 1) {
            ?>
            <div class="item active">
                <?php the_post_thumbnail('full'); ?>
                <div class="carousel-caption">
                    <h2><?php the_title(); ?></h2>

                    <p><?php the_excerpt(); ?></p>
                    <a class="btn btn-success big" href=""></a>
                </div>
            </div>
        <?php
        } else {
            ?>
            <div class="item">
                <?php the_post_thumbnail('full'); ?>
                <div class="carousel-caption">
                    <h2><?php the_title(); ?></h2>

                    <p><?php the_content(); ?></p>
                    <a class="btn btn-success btn-lg" href=""></a>
                </div>
            </div>
        <?php
        }
        $i++; endwhile;
    wp_reset_postdata();
    ?>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
</a>

<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>

这是我的functions.php

//Java for carousel
    if (!function_exists('ss_carousel_exists')) :
        function ss_carousel_exists()
        {
            ?>
            <script type="text/javascript">
                jQuery(document).jQuery(function ($) {
                    jQuery('#myCarousel').carousel({
                        interval: 7000
                    })
                });
            </script>
        <?php
        }

        add_action('wp_footer', 'ss_carousel_exists');
    endif;

Answer 1

我在Richer的帮助下找到了我遇到的问题。我有一个错字。如果你想在WordPress主题中使用bootstrap轮播，上面的代码可以工作。

麻烦旋转木马和我正在建设的主题

1 个答案: