Ключевые выводы
- У Elementor есть два виджета вкладок. оригинальный имел уведомление об устаревании начиная с версии 3.8, и виджет "Вложенные вкладки" заменил его.
- Вложенные вкладки помещают контейнер на каждую панель, поэтому форма, галерея или таблица цен могут находиться внутри вкладки.
- Вложенные вкладки также переключаются на вертикальную компоновку аккордеона ниже выбранной вами точки останова, что является поведением, которое большинство людей хотят видеть на телефонах.
- Виджет дополнения, такой как Виджет "Вкладки мастера" это маршрут, когда сама полоса вкладок является проблемой дизайна: заголовки изображений, предустановки стиля или включение наведения.
- Выбирайте то, что входит внутрь панели Виджеты внутри означают ядро Стильная полоса вкладок над текстом означает дополнение.
Вкладки выполняют одну работу: держать длинную страницу короткой Спецификация, доставка и гарантия не все должны быть на экране сразу, и посетитель, который хочет один из них не должен прокручивать мимо двух других.
Элементор дает вам два виджета для этого и дополнения дают вам больше, поэтому панель поиска “tabs” сбивает с толку Это руководство охватывает все три маршрута, что каждый может держать, и как они ведут себя на телефоне.
Оглавление
Какие вкладки виджета у вас есть на самом деле
Откройте панель виджетов и найдите вкладки. при текущей установке Elementor вы получаете виджет "Вкладки", и вы перетаскиваете вложенную версию. старый виджет все еще находится в коде для страниц, которые уже его используют, и он показывает уведомление на панели, когда вы редактируете один: любой новый виджет вкладок, который вы перетаскиваете, будет новым с вложенными возможностями. Это уведомление было там с Elementor 3.8.
Итак, на практике есть три вещи, которые вы можете использовать, и они не одинаковы.
| Виджет | Что идет в панели | Откуда оно берется |
|---|---|---|
| Вкладки (вложенные) | Контейнер, то есть любые виджеты | Элементор, бесплатно |
| Вкладки (старые) | Только контент редактора | Элементор, устарел с 3.8 |
| Виджет вкладок добавления | Содержимое редактора или сохраненный шаблон с Pro | Мастер Аддоны и другие |
Маршрут 1: виджет "Вложенные вкладки"
Это отправная точка по умолчанию и правильная Перетащите вкладки на страницу, и вы получите три вкладки, каждая из которых содержит пустой контейнер.
- Перетащите виджет вкладок на страницу.
- Переименовать каждый элемент в повторителе вкладок. заголовок - это все, что удерживает ретранслятор, потому что содержимое живет в контейнере.
- Нажмите вкладку на холсте, затем вставьте ее в контейнер, как и где-либо еще.
- В макете используйте направление для перемещения полосы: сверху, снизу, начало или конец, где начало и конец помещают заголовки в боковой столбец.
- В дополнительных настройках установите горизонтальную прокрутку, если заголовки не подходят, и установите точку останова, в которой полоса должна стать аккордеоном.
Контейнер - это вся точка Контактная форма, галерея, таблица цен или сетка циклов - все это работает внутри вкладки, и больше ничего в этом списке не может этого сделать. торговля заключается в том, что сама полоса вкладок довольно проста: заголовки с необязательным значком, и нет предустановки для начала.
Маршрут 2: виджет вкладок дополнений
Виджеты-аддоны существуют для другой половины проблемы, где полоска - это дизайн. виджет Master Addons строит каждую вкладку из ряда ретранслятора, который несет свои собственные поля.
Сборка:
- Перетащите виджет и выберите предустановку стиля.
- Добавьте один элемент ретранслятора на вкладку с заголовком вкладки.
- Установите "Тип значка" на "Нет", "Значок" или "Изображение", затем выберите значок или загрузите изображение.
- Запишите содержимое панели в редакторе или в разделе "Тип контента точки Pro" в сохраненном разделе, виджете или шаблоне страницы.
- Установите Tab Effect на "Нажмите или наведите курсор" и переключите "Установить по умолчанию" на вкладке, которая должна открыться первой.
От чего вы отказываетесь, так это от контейнера Панели принимают содержимое редактора, поэтому форма внутри вкладки означает либо маршрут Pro с сохраненным шаблоном, либо основной виджет.
Маршрут 3: старый виджет вкладок
Если вы редактируете страницу, созданную несколько лет назад, вы можете смотреть на исходный виджет: повторитель Tabs Items с заголовком и полем контента, а также элемент управления позицией для горизонтального или вертикального. Он все еще работает, и Elementor по-прежнему отправляет его так, чтобы старые страницы не ломались.
Нет причин начинать с него новую страницу Если вы уже там, вопрос в том, стоит ли перестройка блока как Вложенные вкладки нескольких минут, и обычно это так, потому что вы получаете точку разрыва аккордеона и контейнер.
Какой маршрут соответствует заданию
| Что нужно | Использовать |
|---|---|
| Форма, галерея или таблица цен внутри вкладки | Вложенные вкладки |
| Вкладки, которые становятся гармошкой на телефонах | Вложенные вкладки |
| Изображение в заголовке каждой вкладки | Аддон виджет |
| Разработанная полоса без укладки с нуля | Виджет дополнения через предустановки |
| Переключение панелей на зависании | Аддон виджет |
| Тот же сохраненный шаблон повторно использовался в нескольких блоках вкладок | Аддон виджет на Pro |
| Редактирование страницы, созданной до Elementor 3.8 | Старый виджет, или перестроить его |
Пять вещей, которые стоит исправить
- Сохраните заголовки в одном или двух словах. длинные заголовки обернуть, и обернутая полоса перестает читать как полоса.
- Четыре вкладки - это комфортный максимум на рабочем столе, а три лучше, когда заголовки содержат значки.
- Решите, что открывается первым. основной виджет всегда открывает первую вкладку, поэтому поместите туда панель, которую хочет большинство людей.
- Все, что должен прочитать посетитель, принадлежит странице, а не щелчку мыши на четвертой вкладке.
- Проверьте вид телефона перед публикацией, потому что там два маршрута ведут себя по-разному.
Часто задаваемые вопросы
Есть ли у Elementor виджет вкладок в бесплатной версии?
Да. виджет "Вкладки" находится в бесплатном плагине, а текущая версия является вложенной, которая помещает контейнер внутрь каждой панели.
Что случилось со старым виджетом Tabs?
Он устарел. так как Elementor 3.8 панель показывает уведомление при редактировании одного, и любой новый виджет вкладок, который вы перетаскиваете, является вложенной версией.
Могу ли я поместить форму или галерею на вкладку?
С Вложенными вкладками, да, потому что каждая панель является контейнером. с виджетом-дополнением панель принимает содержимое редактора, поэтому эквивалент является сохраненным шаблоном на Pro.
Может ли заголовок вкладки использовать изображение вместо текста?
Не в основном виджете. аддон-виджеты с элементом управления типа значка могут использовать значок или изображение в заголовке.
Сколько вкладок слишком много?
После четырех или пяти стриптиз оборачивается на ноутбуки и становится нечитаемым на телефоны. В этот момент аккордеон обычно лучше раскладывается.
Заключительные мысли
То, что находится внутри панели решает это Виджеты в панели означает Вложенные вкладки, каждый раз. полоса, которая должна выглядеть как что-то конкретное, с заголовками изображений или переключением наведения, означает аддон. оба являются десятиминутной сборки, как только вы знаете, в какой из них вы находитесь.
Связанное чтение
