@alexiusgrey

Magnific popup показывает для прокрутки больше фото,чем в галерее, как пофиксить?

Галерея woocommerce, НО НЕ ПЛАГИН, просто руками выведена разметка.
В галерее 5 фотографий, а как открываю в увеличенном виде - показывает 1 из 9.
jQuery('.slider-big').each(function() { // the containers for all your galleries
    jQuery(this).magnificPopup({
        delegate: 'a', // the selector for gallery item
        type: 'image',
        gallery: {
          enabled:true
        }
    });
});

Перед тем еще на этой же галерее навешен слик слайдер. В двух разных функциях.
jQuery('.slider-big').each(function() {
  var slider = jQuery(this);
  slider.slick({
  infinite: true,
  slidesToShow: 1,
  slidesToScroll: 1,
  dots:false,
  arrows: false,  
  driggable:true,
  swipe: false,
 swipeToSlide: false,
 touchMove: false,
  asNavFor: '.slider-standart',  
});
});

Для меня примеры на кодпен, как их применить в одной функции, какие-то непонятные.
Когда одна фото в галерее, она и открывается одна, а как 4-5, то почему-то 9.

Разметка галереи
add_action( 'woocommerce_before_single_product_summary', 'themename_wrapper_product_image_start', 5 );
function themename_wrapper_product_image_start() {
  ?>
  <div class="row single-row">
    <div class="col-xl-7 col-12 slider-wrapper"> 
      <?php 
        global $product;    
           $attachment_ids = $product->get_gallery_attachment_ids();
           if ( ! empty( $attachment_ids ) ) {?>
			<div class="slider-big">
			<?php 
				 $attachment_ids = $product->get_gallery_attachment_ids(); 
				 foreach( $attachment_ids as $attachment_id ) {?>
					<div class="slider-big-item">
						<a href="<?php echo wp_get_attachment_image_src( $attachment_id, 'full' )[0]; ?>">
					<?php 
					 echo wp_get_attachment_image($attachment_id, 'full');?>
						</a>
					</div>
				<?php  }?>
			</div>
		<?php } else{
    $attachment_id = get_post_thumbnail_id( $product->get_id() );
    $product_thub = wp_get_attachment_image_src( $attachment_id, 'full' )[0];	
		?>
    <div class="slider-big"><div class="slider-big-item"><a href="<?php echo wp_get_attachment_image_src( $attachment_id, 'full' )[0]; ?>"><img class="attachment-woocommerce_single" src="<?php echo $product_thub;?>" alt="slider-item"></a></div></div>      
      <?php }?>

      <?php 
        global $product;    
           $attachment_ids = $product->get_gallery_attachment_ids();
           if ( ! empty( $attachment_ids ) ) {?><div class="slider-standart"><?php 
             $attachment_ids = $product->get_gallery_attachment_ids(); 
             foreach( $attachment_ids as $attachment_id ) {?><div class="slider-standart-item"><?php 
            echo wp_get_attachment_image( $attachment_id, 'woocommerce_single' );?></div><?php 
            }
            ?></div><?php } else{
    $attachment_id = get_post_thumbnail_id( $product->get_id() );
    $product_thub = wp_get_attachment_image_url($attachment_id, 'woocommerce_single'); ?>
      <div class="slider-big"><div class="slider-big-item"><img class="attachment-woocommerce_single" src="<?php echo $product_thub;?>" alt="slider-item"></div></div>       
      <?php }    
}


Плагин ставить не хочу - хочу понять, что неправильно, и пофиксить руками, и slick lightbox не подходит, хоть вместе со слайдером ставить и легко - с ним на телефонах нельзя приблизить пальцами, а с магнификом можно.
Может кто-нибудь увидит, где ошибаюсь? Нет, нежелание ставить плагин не ошибка, или не ошибка, которую я ищу здесь.
  • Вопрос задан
  • 66 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы