Опубликовано Оставить комментарий

Галерея на базе Magnific Popup

Magnific Popup — jQuery плагин

functions.php
  // magnific-popup.css
  wp_enqueue_style( 'magnific-popup', get_template_directory_uri() . '/css/magnific-popup.css' );
  // magnific-popup.js
  wp_enqueue_script( 'magnific-popup', get_template_directory_uri() . '/js/magnific-popup.js', array('jquery')); 

Файлы magnific-popup.css и magnific-popup.js взять здесь – https://dimsemenov.com/plugins/magnific-popup/#mfp-build-tool

Перед подключением magnific-popup.js подключить jQuery

Автор плагина – https://dimsemenov.com/

HTML
<div class="gallery">
 <a href="img_1_b.jpg" rel="alternate"><img src="img_1_s.jpg" alt=""></a>
 <a href="img_2_b.jpg" rel="alternate"><img src="img_2_s.jpg" alt=""></a>
 <a href="img_3_b.jpg" rel="alternate"><img src="img_3_s.jpg" alt=""></a>
 <a href="img_4_b.jpg" rel="alternate"><img src="img_4_s.jpg" alt=""></a>
</div>
jQuery
$('.img-gallery').magnificPopup({
	delegate: 'a',
			type: 'image',
			gallery: {
				 enabled: true,
			},
	}
});
Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *