Ретранслятор

The Поле ретранслятора превращает один набор элементов управления в столько строк, сколько нужно пользователю Вы определяете поля один раз (имя, цена, описание) и любой, кто редактирует виджет в Elementor, может добавлять, дублировать, переупорядочивать и удалять элементы с панели, точно так же, как ретрансляторы в собственном списке значков Elementor или виджетах "Свидетельская карусель". Внутри главных аддонов Виджет Строитель, Повторитель - это то, как вы создаете карточные сетки, меню, списки функций, разделы команд и все остальное, где счетчик элементов зависит от владельца сайта, а не от автора виджета.

Ретранслятор соединяется с обеими сопутствующими системами: Условия показывает или скрывает элемент управления на панели, и Механизм шаблонов Twig-синтаксиса делает свои ряды на переднем конце с {% for item in my_repeater %} петли и пунктирные токены как {{ item.title }}. Оба руководства охватывают настройку и ограничения.

Repeater работает вместе с циклом шаблонов в вашем HTML: a {% for %} блок печатает вашу разметку один раз в строке Три пункта рендеринг трех карт; добавить четвертую в панели и появляется четвертая карта, без изменений кода.

Что делает поле Repeater #

Поле Repeater отображает стандартное управление ретранслятором Elementor на панели опций вашего виджета Когда кто-то выбирает виджет, он видит стопку разборных строк с четырьмя знакомыми действиями:

• Добавить товар: кнопка под строками создает новый элемент со значениями по умолчанию.
• Дубликат: значок копирования клонирует строку, настройки и все такое.
• Повторный заказ: строки перетаскиваются в новый порядок, а страница обновляется для соответствия.
• Удалить: значок удаления выводит строку.

Каждая строка расширяется, чтобы показать подполя, которые вы определили: текст, текстовая область, выбор, медиа, URL, значки и другие типы полей Widget Builder могут жить внутри репитера. Это отличается от полей с одним значением, таких как Текст одним важным способом: соединение с вашим HTML - это цикл, а не разовый короткий код. Если вы новичок в создании виджетов, начните с Обзор виджета-строителя первый.

Прежде чем начать #

• WordPress с Элементор установлен и активен.
• Мастер-аддоны для Elementor установлен и активен. Новое в плагине? Видеть руководство установки.
• Пользовательский виджет, открытый в редакторе Widget Builder Наш пример - ресторан “signature thans” раздел, который отображает 3-колоночную сетку карт, по одной карте на ряд Repeater.

Как добавить поле "Повтор" #

В редакторе Widget Builder прокрутите панель полей слева, пока не найдете Ретранслятор поле, перечисленное вместе с другими структурными областями.

Перетащите репитер в раздел под Содержание вкладка, где принадлежит повторяющийся контент. Как только он приземлится, параметры поля откроются слева, и именно здесь происходит реальная настройка: определение подполей, которые будет нести каждая строка.

Объяснены варианты поля ретранслятора #

• Этикетка: заголовок, показанный над строками в Elementor, например “Signature Dishes”.
• Имя: уникальный идентификатор для всего ретранслятора, букв, цифр, и подчеркивает только. это имя ваш цикл относится, например signature_dishes.
• Поля: подполя, которые содержит каждая строка Добавьте по одному на каждый фрагмент содержимого каждого элемента ♪ в примере с тарелкой: текстовое поле Dish Name, текстовое поле Price, текстовую область Description и выберите Tag Style.
• Название Поле: какое подполе обозначает свернутую строку, написанную как {{{ dish_name }}}. По умолчанию используется первое подполе, которое обычно соответствует вашему желанию.
• По умолчанию: строки, с которых начинается виджет. Отправьте два или три заполненных элемента, чтобы виджет выглядел живым при первой же передаче.
• Текст кнопки: метка на кнопке добавления, например “Add Dish” вместо родового “Add Item”.
• Предотвратить пустоту: останавливает пользователя от удаления последней оставшейся строки.
• Мин/Макс Товары: необязательные границы того, сколько или сколько строк разрешено.

Подключите репитер к вашему HTML с помощью цикла #

Вот часть, которая работает по-разному в каждом поле с одним значением: репитер не имеет простой {{shortcode}}. Его значение представляет собой список строк, поэтому ваш HTML переносит повторяющуюся разметку в a {% for %} блок. внутри цикла каждое подполе доступно на переменной цикла:

<div class="dish-grid">
  {% for dish in signature_dishes %}
  <article class="dish-card">
    <h3>{{ dish.dish_name }}</h3>
    <span class="price">{{ dish.dish_price }}</span>
    <p>{{ dish.dish_desc }}</p>
  </article>
  {% endfor %}
</div>

• signature_dishes имя репитера.
• dish это переменная цикла, которую вы изобретаете на месте; называйте это как угодно.
• {{ dish.dish_name }} печатает имя блюда этой строки. Каждое подполе работает одинаково: {{ dish.<sub_field_name> }}.
• Все между {% for %} и {% endfor %} печатает один раз в ряд, в том порядке, в котором ряды расположены на панели.

Дополнительные поля внутри цикла #

Заверните все необязательное в {% if %} блокируйте так, чтобы пустые поля не оставляли случайную разметку. В примере с блюдом каждая карта имеет дополнительный значок тега:

{% if dish.tag_text %}
<span class="tag tag--{{ dish.tag_style }}">{{ dish.tag_text }}</span>
{% endif %}

Строка с пустым текстом тега вообще не отображает значка. The {% if %} блок также принимает сравнения, подобные {% if dish.tag_style == 'spicy' %} когда вам нужна наценка, которая меняется на значение.

Медиа и ссылочные подполя #

Подполе изображения печатает свой URL-адрес напрямую, как в <img src="{{ dish.photo }}">, и URL-подполе таким же образом раскрывает свой адрес Вложенные свойства доступны с точечной записью, когда они вам нужны.

Используйте репитер в Элементоре #

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

Щелкните строку, чтобы расширить её подполя и отредактировать их; предварительный просмотр обновляется в прямом эфире Если новая строка вообще ничего не отображает, проверьте, соответствует ли имя цикла в вашем HTML полю Имя репитера точно (несовпадение не срабатывает молча вместо того, чтобы выдавать ошибку. Нажмите Добавить блюдо (или что бы ни говорил ваш текст кнопки) и появляется новая строка с вашими значениями по умолчанию, готовая к редактированию. Перетащите дескриптор в любую строку, чтобы изменить порядок, и карты на странице следуют.

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

Обычные случаи использования #

• Карточные сетки indu, функции, цены на блюда или членов команды, одна строка за карту.
• Меню и прайс-листы indouritations, салоны и тренажерные залы, где товары меняются еженедельно.
• Стены логотипа и списки клиентов — подполе.
• Часто задаваемые вопросы и секции аккордеона текст вопроса поле и ответ на строку.
• Сроки и этапы процесса ordered рядов, которые пользователь может перетащить в последовательность.

Советы по работе с полем Repeater #

• Петля - это соединение. Нет {{repeater_name}} шорткод для печати самостоятельно; ретранслятор имеет смысл только внутри {% for %}…{% endfor %}.
• Отправить реальные дефолты. Два или три заполненных ряда делают виджет презентабельным в момент его падения, и они удваиваются как пример того, чего ожидает каждое поле.
• Установите поле заголовка. Свернутые строки с меткой “Margherita del Forno” гораздо проще в управлении, чем три строки с меткой “Item”.
• Защитите дополнительные поля с помощью {% if %}. Пустые пролеты и пустые обертки невидимы, пока не нарушат ваше расстояние.
• Позвольте CSS обрабатывать счетчик строк. Сетка с repeat(3, 1fr) самостоятельно переносит дополнительные элементы в новые строки; цикл просто печатает карты.
• Четко назовите подполя. {{ dish.dish_price }} читается лучше в шаблоне, чем {{ dish.field_2 }}, для вас и для тех, кто наследует виджет.

Часто задаваемые вопросы #

Завершая #

Поле "Повторитель виджетов" превращает фиксированную компоновку в живую: определите подполя и распечатайте их в формате a {% for %} цикл, и каждое решение контента после этого происходит в панели Элементор: добавить карту, перетащить ее на место, удалить в следующем сезоне. Соедините его с Типографское поле для шрифтов, управляемых редактором, и Пограничное поле для карточного стиля, и один виджет покрывает целый раздел страницы Исследуйте остальную часть Виджеты и расширения Master Addgetsи посмотрите страница ценообразования за то, что включает каждый план.