ACF фото галерея изображений

Я пытаюсь сделать сетку изображений разных размеров, используя поле галереи ACF.

Мне удалось сделать это раньше в поле повторителя путем подсчета строк, но я не смог настроить это для работы с полем галереи.

Моя цель — создать сетку из 10 изображений, используя 2 разных размера изображения.

  • Изображения 1, 2, 3, 6, 7, 8 будут одного размера
  • Изображения 4, 5, 9, 10 будут другого размера

Моя текущая разметка:

<?php
$images = get_field('home-image-grid');
$size = 'full';
if( $images ):
?>
<ul>
<?php foreach( $images as $image ): ?>
<li>
<?php echo wp_get_attachment_image( $image['ID'], $size ); ?>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>

Я пробовал разметку, которую я использовал ранее с полем повторителя, но это только выводит изображение 1.

<?php
$i = 1;
$images = get_field('home-image-grid');
$size = 'full';
if( $images ):
?>

<?php foreach( $images as $image ): ?>

<?php if ( $i == 1 ) { ?>
image 1
<?php } elseif ( $i == 2 ) { ?>
image 2
<?php } elseif ( $i == 3 ) { ?>
image 3
<?php } elseif ( $i == 4 ) { ?>
image 4
<?php } ?>

<?php endforeach; ?>

<?php endif; ?>

Я предполагаю, что это из-за утверждения foreach. Как я могу заставить это работать?

0

Решение

Эта работа будет выполнена как в галерее, так и в поле повторителя, оба возвращают массив.

Вы просто забыли добавить итерацию $i++ в петле.

Таким образом, ваш цикл будет как

<?php foreach( $images as $image ): ?>

<?php if ( $i == 1 ) { ?>
image 1
<?php } elseif ( $i == 2 ) { ?>
image 2
<?php } elseif ( $i == 3 ) { ?>
image 3
<?php } elseif ( $i == 4 ) { ?>
image 4
<?php }
$i++;
endforeach; ?>

Кроме того, если у вас нет сложных условий с индексами массива, вы можете использовать цикл foreach с индексом массива, например:

<?php foreach( $images as $index => $image ): ?>

<?php if ( $index == 0 ) { ?>
image 1
<?php } elseif ( $index == 1 ) { ?>
image 2
<?php } elseif ( $index == 2 ) { ?>
image 3
<?php } elseif ( $index == 3 ) { ?>
image 4
<?php }
endforeach; ?>
0

Другие решения

Других решений пока нет …