Поповер Тоггл

Поле Popover Toggle группирует несколько связанных настроек за одним управлением включением/выключением в специальном виджете, созданном с помощью главных аддонов Виджет Строитель.В Элементоре он отображается как один ряд с карандаш значок. щёлкнув карандаш включает опцию и открывает небольшой поповер с настройками внутри. он удерживает необязательные дополнения, как наложение или значок, от заполнения панели.

Поповер Toggle является полем Pro. бесплатный плагин включает ограниченный Widget Builder, и полный набор полей поставляется с Мастер Аддоны Про.

Что делает поле Popover Toggle #

• Добавляет на панель виджета одну строку: Этикетку, значок карандаша и, включив, стрелку сброса.
• Карандаш включает опцию и открывает поповер с определенными вами полями.
• Сам переключатель хранит yes когда включено и ничего не выключено, поэтому ваш шаблон может проверить его {% if %}.
• Каждое поле внутри поповера получает свой жетон, сделанный из названия тумблера и названия поля, соединенного подчеркиванием.

Если вы еще не создали виджет, прочтите Обзор виджета-строителя первый.

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

• WordPress с установленным и активным элементом Elementor.
• Мастер-аддоны для Elementor и Master Addons Pro, оба активные. The руководство установки настройка обложек.
• Виджет, открытый в Widget Builder Пример в этом руководстве - виджет “Image Banner” с необязательным наложением: Popover Toggle named overlay с двумя полями внутри, color и strength.

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

1. Перейти к Мастер-аддоны > Виджет-строитель и откройте виджет.
2. Нажмите « Стиль вкладка и добавить раздел, например “Overlay”.
3. Тип popover в поле поиска слева.
4. Драг Поповер Тоггл в раздел Его настройки открываются в левой боковой панели.

Объяснены параметры поля Popover Toggle #

• Этикетка текст рядом с карандашом в Elementor, например “Overlay”.
• Имя является ли уникальный идентификатор поля и начало каждого создаваемого им токена, так что держите его коротким, например overlay. Только буквы, цифры и подчеркивания.
• Описание это записка для вас внутри строителя.
• Этикетка на и Отключить метку сохраняются с полем, но Элементор показывает это управление как значок карандаша, поэтому эти слова не появляются на панели.
• Поповер Филдс перечисляет поля внутри popover.Каждая строка имеет a Имя, а Этикетка и а Тип. Нажмите Добавить поле для другой строки значок копии должен дублировать один или красный крест, чтобы удалить его.
• Значение по умолчанию устанавливает, начинается ли новая копия виджета с опцией "Да" или "Выкл" (Нет).

Меню Тип предлагает Текст, Номер, Текстария, WYSIWYG, Код, Скрытый, Переключатель, Цвет, Шрифт, Типографика, Дата Время, URL, Медиа, Галерея, Значки, Слайдер, Размеры и Фон. строки имеют только имя, метку и тип, поэтому негде установить значение по умолчанию или диапазон для поля внутри popover. Поле Слайдер здесь использует стандартный диапазон Elementor, от 0 до 1000 для px.

Общие настройки продолжают работать, как и в других областях.

Прочтите переключатель и его поля в своем шаблоне #

Два правила охватывают все, что дает вам это поле:

• Отпечатывает собственное имя переключателя yes когда он включен и ничего, когда он выключен. Используйте его в {% if overlay %}.
• Поле внутри поповера читается как имя переключателя, подчеркивание, затем название поля. The color поле становится {{ overlay_color }}и strength слайдер становится {{ overlay_strength.size }}.

<div class="img-banner">
  {% if overlay %}
    <div class="img-banner__overlay" style="background: {{ overlay_color }}; opacity: {{ overlay_strength.size }}%;"></div>
  {% endif %}
  ...
</div>

Точки не работают на поля внутри поповера В наших тестах {{ overlay.color }} ничего не напечатал, пока {{ overlay_color }} напечатал цвет. поля также сохраняют свои значения, когда переключатель выключен, поэтому всегда заворачивайте их {% if overlay %}.

Нажмите Сохранить настройки когда закончишь.

Используйте Popover Toggle в Elementor #

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

Нажмите на карандаш. опция включается, и popover открывается с вашими полями. Установите их и виджет обновляется сразу. нажмите снаружи popover, чтобы закрыть его. чтобы снова выключить опцию, нажмите круговую стрелку сброса рядом с карандашом.

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

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

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

• Имя переключателя держите коротким Каждое поле внутри него начинается с этого имени.
• Всегда проверяйте переключение {% if %} перед использованием своих полей, потому что значения остаются сохраненными, когда оно выключено.
• Используйте два или три связанных поля на одно всплывающее окно. больше, чем это легче найти в обычном разделе.
• Установите стили по умолчанию на вкладке CSS. Поля внутри поповера не имеют собственных значений по умолчанию.
• Для простого включения/выключения без настроек внутри используйте Поле коммутатора.

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

Завершая #

Добавьте Popover Toggle, перечислите его поля, проверьте {% if toggle_name %} в своем шаблоне и прочитайте каждое поле как {{ toggle_name_field_name }}. Редакторы получают аккуратную панель, а дополнительные настройки появляются только тогда, когда они включают опцию. Вместо этого группировку настроек во вкладки см Поле вкладоки проверьте ценообразование за то, что включает каждый план.