Как использовать поле Repeater в ACF PRO

Обзор

Поле Repeater — это по сути способ организовать и отображать данные, в частности повторяющийся контент, такой как слайды, биографии участников команды и события. Это правда, но это не совсем отражает все возможности этого замечательного поля. В этой статье мы покажем, как раскрыть настоящую силу поля Repeater, зарегистрировать и настроить поля, а также работать с вложенными полями Repeater для еще большей гибкости.

Поле Repeater доступно в ACF PRO вместе с другими сложными типами полей, поддержкой страниц настроек и ACF Blocks. В этом руководстве в качестве примера используется ресторанное меню, но у поля [a href="https://www.advancedcustomfields.com/resources/repeater/"]Repeater field[/a] почти нет ограничений по возможным сценариям использования.

Как работает поле Repeater

Поле Repeater служит оболочкой для теоретически неограниченного числа подполей, что дает вам невероятную гибкость при создании сайтов WordPress. В поле Repeater можно использовать любое из [a href="https://www.advancedcustomfields.com/resources/#field-types"]30 доступных полей[/a].

Единственные ограничения на количество повторов — это те, которые вы зададите в настройках поля. Однако при большом количестве строк Repeater на экране редактирования (WP Admin) могут возникать последствия для производительности. Для полей Repeater с очень большим числом строк, которые редактируются нечасто, мы рекомендуем [a href="https://www.advancedcustomfields.com/resources/repeater/#pagination"]включить пагинацию в поле Repeater[/a], чтобы снизить влияние на производительность.

Вложенные поля Repeater

Ваши подполе могут даже включать другие поля Repeater со своими собственными наборами подполей, вложенными в исходное поле Repeater. На практике это означает, что вы можете дать клиентам еще больше гибкости в том, как они выстраивают свой контент.

Например, предположим, что вы разрабатываете сайт для обучения или образовательный сайт, и клиент хочет отображать информацию о курсах, которые он предлагает, и уроках внутри этих курсов. Клиент также хочет регулярно добавлять новые курсы и обновлять существующие, поэтому статические страницы не подойдут.

Одного поля Repeater от ACF было бы достаточно, если бы нужно было только показывать курсы, добавлять новые и обновлять детали. Но помните: клиент также хочет отображать уроки внутри каждого курса, обновлять их по мере необходимости, добавлять новые и так далее — точно так же, как он делает это с курсами.

В этом случае решение — использовать [a href="https://www.advancedcustomfields.com/resources/working-with-nested-repeaters/"]вложенный Repeater[/a]. Первое поле Repeater («Курсы») включает второй Repeater («Уроки»), который вызывается по мере необходимости, предоставляя клиенту гибкость редактировать и обновлять и курсы, и уроки в любое время, когда это понадобится.

Сценарии использования

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

Использовал это, чтобы помочь добавить настраиваемые размещаемые метки и местоположения на Apple Maps для компании по недвижимости. Работает как часы!

— SlickRemix (@SlickRemix) 30 декабря 2022

Поле Repeater в ACF отображает данные в едином формате, но именно это не делает его таким полезным. Статическая страница справилась бы с тем же самым… если бы данные никогда не менялись. Но мы ведь знаем, что данные будут меняться, правда? Участники команды приходят и уходят, компания добавляет новые фирменные материалы, курсы появляются и удаляются. Очень скоро наша красивая статическая страница устаревает, и клиенту требуется наше личное участие, чтобы обновить ее.

Настоящая сила поля Repeater, особенно в вложенном виде, заключается в том, что оно дает вашим клиентам свободу обновлять контент под свои задачи, при этом гарантируя, что новый контент будет соответствовать существующему дизайну.

В примерах ниже мы покажем, как создать меню ужинов для ресторана с помощью поля Repeater. Конечно, меню — это лишь пример. К концу этого руководства вы сможете использовать очень похожее решение практически в любой ситуации, где нужно организовать данные по категориям и иерархии подкатегорий, последовательно отображать эти данные и позволить редактирование пользователем или клиентом.

Регистрация полей и настройка полей

Первое, что нам нужно сделать, — создать новую группу полей с полем Repeater и дать ей название. Мы назвали нашу группу полей «Страница: Меню», а первое поле Repeater — «Категория меню». Repeater «Категория меню» будет представлять типичные категории ресторанного меню, например закуски, основные блюда, десерты и т. д.

Каждая категория меню может включать несколько блюд. Для каждого из них также будет использоваться вложенное поле Repeater, у которого, в свою очередь, будут собственные подполе. Ограничений на тип или количество подполей, которые вы можете использовать, нет, но в этом случае нам нужны только несколько:

• Два поля [a href="https://www.advancedcustomfields.com/resources/text/"]Text[/a] для названий категории меню и блюда.
• Поле [a href="https://www.advancedcustomfields.com/resources/textarea/"]Text Area[/a] для описания блюда.
• Поле [a href="https://www.advancedcustomfields.com/resources/text/"]Number[/a] для отображения цены.
• Поле [a href="https://www.advancedcustomfields.com/resources/checkbox/"]Checkbox[/a], чтобы клиент мог просто отметить, является ли блюдо вегетарианским, безглютеновым, содержит ли оно морепродукты и т. д.

Сейчас хороший момент еще раз подчеркнуть, насколько много гибкости вам и вашим клиентам дает возможность добавлять подполе. Что если у ресторана есть фирменное блюдо, которое нужно заказывать сильно заранее, чтобы у персонала было достаточно времени купить ингредиенты и приготовить его? Просто добавьте подполе [a href="https://www.advancedcustomfields.com/resources/date-time-picker/"]Date Time Picker[/a] к этому элементу меню в Repeater!

Итоговая иерархия полей будет выглядеть так:

• Поле Repeater – Категория меню
  • Текстовое подполе – Название категории меню
  • Поле Repeater – Пункт меню
  • Текстовое подполе – Название
  • Числовое подполе – Цена
  • Подполе Text Area – Описание
  • Подполе Checkbox – Диета & аллергены

В качестве настройки для родительской группы Repeater мы выбрали блочный макет. Похоже, он обеспечивает лучший редакторский опыт, и к этому мы сейчас перейдем.

Редактирование и ввод данных

Теперь, когда все необходимые поля Repeater и подполе зарегистрированы в ACF PRO, можно добавлять пункты меню. Прекрасная часть в том, что этот этап практически может выполнить кто угодно.

Одно из главных преимуществ поля Repeater — то, как оно упрощает процессы дизайна и разработки. Оно дает редакторам контента, маркетологам и владельцам малого бизнеса невероятную свободу создавать и изменять контент по мере необходимости, при этом обеспечивая жесткий контроль над его отображением.

Первый шаг — создать название категории меню (Закуски). Затем начните добавлять информацию во вложенное поле Repeater для каждого элемента.

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

Логика вывода для шаблонов

После того как мы добавили все блюда, нам все еще нужно вывести данные поля ACF в шаблоне. По ходу дела мы разберем часть используемого PHP, а полный код можно найти в themes/qorp/page-menu.php.

Вам нужно включить обычные элементы, которые используются при создании PHP-шаблона, например функцию get_header() и Цикл WordPress, а также применить любую нужную стилизацию к шаблону.

После этого мы можем использовать функцию get_field для вызова наших родительских полей Repeater — категорий меню:

$menu_categories = get_field( 'qorp_menu_category' );

if ( $menu_categories ) :
     foreach ( $menu_categories as $menu_category ) :

Следующие несколько строк говорят нашему шаблону подхватить названия категорий (например, Закуски) и массив пунктов меню для каждой категории:

$menu_category_name = $menu_category['qorp_menu_category_name'];
$menu_category_items = $menu_category['qorp_menu_item'];
if ( $menu_category_name && $menu_category_items ) :

Теперь наш шаблон будет отображать и категории, и блюда внутри них, но пока на этом все. Далее мы добавляем подполе для нашего поля Repeater с пунктами меню:

foreach ( $menu_category_items as $menu_item ) :
     $menu_item_title = $menu_item['qorp_title'];
     $menu_item_price = $menu_item['qorp_price'];
     $menu_item_description = $menu_item['qorp_description'];
     $menu_item_diet_allergens = $menu_item['qorp_diet_allergens'];

Наконец, мы можем добавить в шаблон параметры Checkbox:

if ( $menu_item_diet_allergens ) :
     foreach ( $menu_item_diet_allergens as $diet_allergen ) :

     endforeach;

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

Заключение

Основное назначение поля Repeater — служить оболочкой для других полей. Хотя у него есть множество сценариев использования, это все равно лишь малая часть того, что можно создать, когда вы начинаете добавлять вложенные Repeaters.

Вложенные Repeaters — это потрясающее решение, которое дает вам контроль, при этом позволяя клиенту менять контент и структуру страницы с максимально возможной свободой.

Во многом мы лишь слегка затронули то, что можно сделать с вложенными Repeaters и ACF PRO. Это руководство — не полный список того, чего можно достичь, а отправная точка, которая должна вдохновить ваши собственные идеи. Двигайтесь вперед и создавайте что-то отличное.

Обновлено: 01.06.2026