Поддержка → Проблемы и решения → Подключение Slick Slider к WordPress?
Подключение Slick Slider к WordPress?
-
Не работает слайдер Slick Slider в собственной теме Вордпресса. Посмотрел кучу подобных вопросов, как я понял все упирается в зависимости подключения js файлов к движку. У меня зависимости указаны, в доказательство этому работает другой jquery плагин в шаблоне.
Собственно сам файл functions.php:
<?php add_action( 'wp_enqueue_scripts', 'summer_palace_style' ); add_action( 'wp_enqueue_scripts', 'summer_palace_scripts' ); function summer_palace_style() { wp_enqueue_style( 'normalize-style', get_template_directory_uri() . '/assets/css/magnific-popup.css' ); wp_enqueue_style( 'slick', get_template_directory_uri() . '/assets/css/slick.css' ); wp_enqueue_style( 'slick-theme', get_template_directory_uri() . '/assets/css/slick-theme.css' ); wp_enqueue_style( 'magnific-style', get_template_directory_uri() . '/assets/css/normalize.css' ); wp_enqueue_style( 'main-style', get_stylesheet_uri(), array('normalize-style', 'magnific-style')); } function summer_palace_scripts() { wp_deregister_script( 'jquery' ); wp_register_script( 'jquery', 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js', NULL, '3.6.0', false); //wp_register_script( 'jquery', get_template_directory_uri() . '/assets/js/jQuery.js', NULL, 'jQuery', false); wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'slick-script', get_template_directory_uri() . '/assets/js/slick.min.js', array('jquery'), null, true ); wp_enqueue_script( 'magnific-script', get_template_directory_uri() . '/assets/js/jquery.magnific-popup.min.js', array('jquery'), null, true ); wp_enqueue_script( 'main-script', get_template_directory_uri() . '/assets/js/main.js', array('jquery'), null, true ); }
Активация слайдера
/*SLIDER*/ jQuery('.header__slider').slick({ infinite: true, slidesToShow: 3, slidesToScroll: 1, arrows: true, appendArrows: '.slider-arrows', prevArrow: '<img class="header__slider-prev" src="img/prev-btn.svg" alt="">', nextArrow: '<img class="header__slider-next" src="img/next-btn.svg" alt="">', responsive: [ { breakpoint: 781, settings: { slidesToShow: 2, slidesToScroll: 1, } }, { breakpoint: 571, settings: { slidesToShow: 1, slidesToScroll: 1, } }, ] });
-
slick точно работает с jQuery 3.6?
В консоли браузера ошибки есть?
Да, в вёрстке слайдер работает.
Со слайдером разобрался, появился следующий вопрос. Как правильно прописать путь к картинке в файле в js файле?
Есть такой код активации слайдера
`jQuery(‘.header__slider’).slick({
prevArrow: ‘<img class=»header__slider-prev» src=»<?php bloginfo(template_url
); ?> /assets/img/prev-btn.svg» alt=»»>’,
nextArrow: ‘<img class=»header__slider-next» src=»<?php bloginfo(template_url
); ?> /assets/img/next-btn.svg» alt=»»>’,
});
- Тема «Подключение Slick Slider к WordPress?» закрыта для новых ответов.