如何在WordPress主题中添加光滑的silder

我试图在我的wordpress主题中使用光滑的滑块, 但这根本不起作用。我唯一能看到的是带有两个标题和两个描述的两个图像。你能告诉我为什么滑块根本不工作吗?

function.php

 function cardiff_slick_slider() {
        wp_register_style( 'cardiff-slick', get_stylesheet_uri().'/assets/plugins/slick/slick.css', 'all' );
        wp_register_style( 'cardiff-slick-theme', get_stylesheet_uri().'/assets/plugins/slick/slick-theme.css', 'all' );
        wp_register_script( 'cardif-slick-init', get_stylesheet_directory_uri() . '/assets/js/slick-init.js', array('slickjs'));
        wp_register_script('cardiff-slick-slider', get_stylesheet_directory_uri() . 'assets/plugins/slick/slick.js', array('jquery'), '', true );
        wp_enqueue_style( 'cardiff-slick' );
        wp_enqueue_style( 'cardiff-slick-theme' );
        wp_enqueue_script ('cardiff-slick-slider');
        wp_enqueue_script ('cardiff-slick-init');
    }
    add_action( 'wp_enqueue_scripts', 'cardiff_slick_slider');

这是我的index.php, 借助自定义帖子类型, 我在其中获取了所需的数据。

    this is my index.php
    $args=array('post_type'=>'slider');
    $loop=new WP_Query($args);
    if($loop->have_posts()):?>
         <section class="bailboard">
              <div class="main-slider">
                  <?php while($loop->have_posts()):$loop->the_post();?>
                            <div class="slider-item">
                                <div class="slider-content">
                                    <div class="container">
                                        <div class="headlines">
                                            <h1><?php the_title();?></h1>
                                            <div class="row">
                                                <div class="col-sm-8 col-sm-offset-2">
                                                    <p><?php the_content();?></p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <?php the_post_thumbnail(); ?>
                            </div>
                        <?php
                        endwhile;
                  ?>
               </div>
         </section>

        <?php
             else:
        echo'<p>No Content Found</p>';
    endif;

#1


你可以为此使用该插件:

WP Slick Slider and Image Carousel

如果要集成到代码中, 请使用do_shortcode()函数。

  <?php  echo do_shortcode( '[slick-slider <design code>]' ); ?>

对于旋转木马滑块,

<?php echo do_shortcode( '[slick-carousel-slider <design code>]' ); ?>

来源:

https://www.srcmini02.com/66525.html

微信公众号
手机浏览(小程序)
0
分享到:
没有账号? 忘记密码?