【问题标题】:Testimonials slider loop/query not working PHP Wordpress推荐滑块循环/查询不起作用 PHP Wordpress
【发布时间】:2021-03-18 02:14:41
【问题描述】:

所以,我正在尝试使用 Slick 滑块显示推荐,但它不起作用。我想我将 css 和 js 文件链接错了,或者因为正在显示推荐但滑块不起作用。所以请帮助解决问题。

这是代码:

HTML

    <section class="reviews">
                <div class="row d-flex flex-column">
                    <div class="testimonial-holder">                
                        <?php
                            $args = array(
                            'post_type'   => 'testimonials',
                            // 'post_status' => 'publish',
                            // 'posts_per_page' => 1,
                            // 'order' => 'ASC',
                            );
                            $query = new WP_Query( $args );
                        ?>
                            <?php
                            while( $query->have_posts() ) :
                                $query->the_post(); 
                        ?>

                            <div class="lead-text d-flex text-center justify-content-center flex-column">
                                <?php echo '<p class="lead">' . get_the_content() . '</p>' . '<small>' . '-' . get_the_title() . '</small>'; ?>
                            </div>
                        <?php endwhile;
                        wp_reset_postdata(); ?>
                    </div>
                </div>
            </section>

查询

function load_css() {

wp_register_style( 'slick', get_template_directory_uri() . '/src/js/slick/slick.css', array(), false, 'all' );
wp_enqueue_style('slick');

} add_action('wp_enqueue_scripts', 'load_css');

函数 load_js() {

wp_register_script( 'slick', get_template_directory_uri() . '/src/js/slick/slick.min.js', false, true);
wp_enqueue_script('slick');

} add_action('wp_enqueue_scripts', 'load_js');

用 JQUERY 调用它//这只是一行代码,它应该可以工作

$('.testimonial-holder').slick();

【问题讨论】:

    标签: php wordpress slick.js testimonials


    【解决方案1】:

    您是否在 document.ready 状态上附加了 .slick() 回调?

    【讨论】:

    • 抱歉回复晚了。我不知道。我放弃了这个,因为我无法弄清楚。使用插件,但即使这样也让我感到困惑。感谢您的回复。
    【解决方案2】:

    最后,我使用带有数字字段的高级自定义字段实现了这一点。我放弃了滑块并稍微改变了概念。因此,取决于在字段中输入的数字,它将在前端生成星数。

    <?php
                                $args = array(
                                'post_type'   => 'testimonials',
                                'post_status' => 'publish',
                                'posts_per_page' => 1,
                                'order' => 'DESC',
                                'orderby'=> 'rand',
                                );
                                $query = new WP_Query( $args );
                                    //if( $query->have_posts() ) :
                            ?>
                                <!-- Displaying testimonials -->
                        
                            <?php
                                while( $query->have_posts() ) : ?>
                                    <!-- <div class="col-lg-4"> -->
                                    <div class="content-holder">
                                        <?php $query->the_post(); ?>
    
                                        <div class="stars-holder">
                                            <?php 
                                                $star = get_field('stars');
                                                $count = 0;
                                                $element = '<i class="fa fa-star"></i>';
                                                while ($count < $star) : $count++;
                                                    echo $element;
                                                endwhile;
                                            ?>  
                                        </div>                  
                                        <div class="lead-text d-flex text-center justify-content-center flex-column">
                                            <?php echo '<p class="lead">' . get_the_content() . '</p>' . '<small>' . '-' . get_the_title() . '</small>'; ?>
                                        </div>
                                    </div>
                                <!-- </div> -->
                                <?php endwhile;
                                wp_reset_postdata(); ?>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-03-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多