jquery - 我想为 woocommerce 档案中的产品库制作光滑的滑块，我做错了什么？

Question

它显示不正确。Slick with lightbox，但我尝试在没有它的情况下使用它，所以它不是导致不正确工作的灯箱。我想要完全编码，而不是插件。

php部分，我显示画廊的地方

add_action( 'woocommerce_before_shop_loop_item_title', ' themename_loop_product_div_image_open', 5);
function themename_loop_product_div_image_open(){
?>
  <div class="wrap-loop-img-item">
    <?php 
    global $product;       
    
    $attachment_ids = $product->get_gallery_attachment_ids();
    if ( ! empty( $attachment_ids ) ) {         
    foreach( $attachment_ids as $attachment_id ) {?><div class="slider-item"><?php 
    echo wp_get_attachment_image( $attachment_id, 'woocommerce_thumbnail' )?></div><?php ;
  }}else{
    $attachment_id = get_post_thumbnail_id( $product->get_id() );
    $product_thub = wp_get_attachment_image_url($attachment_id, 'woocommerce_thumbnail'); ?>
    <img src="<?php echo $product_thub;?>" alt="">      
      <?php 
  }
  ?>
<?php }
add_action( 'woocommerce_before_shop_loop_item_title', ' themename_loop_product_div_image_close', 30);
function  themename_loop_product_div_image_close(){  
  ?>
  </div>   
   <?php }

js部分

jQuery('.wrap-loop-img-item').each(function() {
  var slider = jQuery(this);
  slider.slick({
  infinite: true,
  slidesToShow: 1,
  slidesToScroll: 1,
  dots:false,
  arrows: false,  
  driggable:false,
  swipe: false,
 swipeToSlide: false,
 touchMove: false,
});
var sLightbox = jQuery(this);
  sLightbox.slickLightbox({
    src: 'src',
    itemSelector: '.img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail',   
  });
});

也许你看到我在哪里犯了错误？或者也许我对此一无所知，我必须知道。

标签： jquerywordpresswoocommerceslick.js