@arkanum

Почему не работает вывод слайдера на PHP через Advanced Custom Fields?

В админку Wordpress вывожу поля Advanced Custom Fields (ACF) для заливки изображений в продукт:

array (
				'key' => 'field_544a7adeaaaa0',
				'label' => 'Project gallery',
				'name' => 'project_gallery',
				'type' => 'repeater',
				'sub_fields' => array (
					array (
						'key' => 'field_544a7b0daaaa1',
						'label' => 'Project image',
						'name' => 'project_image',
						'type' => 'image',
						'column_width' => '',
						'save_format' => 'id',
						'preview_size' => 'thumbnail',
						'library' => 'all',
					),
				),
				'row_min' => '',
				'row_limit' => '',
				'layout' => 'table',
				'button_label' => 'Add Image',
			),


Изображения заливаются и появляются в админке. Если выводить просто изображения через while ( have_rows( , они появляются, но мне нужен был слайдер. Нашёл подходящий PHP-слайдер sachinchoolur.github.io/lightslider и начал его подключать к выводу.

Вот что получилось в коде:
jQuery(document).ready(function() {
            jQuery('#MYlightSlider').lightSlider({
                gallery:true,
                item:1,
                thumbItem:9,
                slideMargin: 0,
                speed:500,
                auto:true,
                loop:true            
            });
		});


Этот цикл подключен к ACF и PHP-галереи:
<?php
								$gallery               = '';

								while ( have_rows( 'project_gallery' ) ) {
									the_row();

									$image = get_sub_field( 'project_image' );
$size = 'thumbnail'; // (thumbnail, medium, large, full or custom size)
$thumb = wp_get_attachment_image_url( $image, $size );
									$gallery .= '<li data-thumb="'.$thumb.'">';
									$gallery .= wp_get_attachment_link( absint( $image ), 'project-gallery' );
								}
								echo strip_tags( apply_filters( 'the_content', $gallery ), '<li><img>' );
							?>


Слайдер появляется только тогда, когда я сворачиваю окно браузера, либо вывожу его в первый таб. Табы организую через bootstrap:

<ul class="nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#mainxt" aria-controls="mainxt" role="tab" data-toggle="tab">Описание продукта</a></li>
<li role="presentation"><a href="#photovid" aria-controls="photovid" role="tab" data-toggle="tab"><?php echo $project_meta_fields_desc['photo-video']['label']; ?></a>
</li>
</ul>


Вот и непонятно, почему слайдер не прогружается сразу.
Проблему можно увидеть на сайте: https://goo.gl/l7r3AI

Слайдер во второй вкладке "Фото и Видео", которая расположена в левом сайдбаре.
  • Вопрос задан
  • 337 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы