Я пытаюсь интегрировать lightGallery с lightSlider на моем сайте Wordpress, следуя инструкциям на этой странице http://sachinchoolur.github.io/lightslider/examples.html
Однако я не могу заставить его работать.Это коды, которые я использую.
single.php
<?php
// ACF Fields
// tl_slide_images = Gallery Field
function themeprefix_lightslider_thumbslider() {
$images = get_field('gallery'); //add your correct field name
if( $images ): ?>
<ul id="imageGallery" class="image-gallery">
<?php foreach( $images as $image ): ?>
<li data-thumb="<?php echo $image['url']; ?>">
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
</li>
<?php endforeach; ?>
</ul>
<?php endif;
}
themeprefix_lightslider_thumbslider(); ?>
lightslider-init.js
jQuery(document).ready(function($){
$('#imageGallery').lightSlider({
gallery:true,
item:1,
auto:false,
loop:true,
thumbItem: 9,
enableDrag: false,
adaptiveHeight: true,
slideMove: 1,
auto: false,
speed: 800,
pause: 4000,
onSliderLoad: function(el) {
el.lightGallery({
selector: '#imageGallery .lSSlide'
});
}
});
});
Я подал lightGallery.js и lightGallery.css и попробуйте вызвать их с помощью
<link type="text/css" rel="stylesheet" href="css/lightGallery.css" />
<script src="js/lightGallery.js"></script>
Однако, я подозреваю, что это где-то не так, так как мой lightSlider вызывается с помощью следующего кода в functions.php
/**
* LightSlider Scripts
*/
add_action( 'wp_enqueue_scripts', 'ls_scripts_styles', 20 );
function ls_scripts_styles() {
wp_enqueue_style( 'lightslidercss', get_stylesheet_directory_uri(). '/css/lightslider.min.css' , array(), '1.0.0', 'all' );
wp_enqueue_script( 'lightsliderjs', get_stylesheet_directory_uri() . '/js/lightslider.min.js', array( 'jquery' ), '1.0.0', true );
wp_enqueue_script( 'lightsliderinit', get_stylesheet_directory_uri() . '/js/lightslider-init.js', array( 'lightsliderjs' ), '1.0.0', true );
}
Можеткто-нибудь мне помочь?Пожалуйста, обратите внимание, что я все еще новичок в этом.