Виджет подсказки Elementor - добавляйте подсказки о наведении в любом месте
Элемент Tooltip - это автономный виджет Elementor. Перетащите его рядом с полем формы, внутри таблицы цен или рядом с запутанным термином, и он отобразит собственный пузырь триггера плюс всплывающей подсказки. Если вы хотите прикрепить всплывающую подсказку к кнопке, значку или разделу, которые уже существуют на странице, используйте Расширение ToolTips вместо.
Что можно сделать с виджетом Tooltip
Контроль размещения
Напишите текст подсказки, затем выберите, где появляется пузырь: верхний, нижний, левый, правый, плюс начальный и конечный варианты. Тонкая настройка со смещениями пикселей X и Y, чтобы пузырь никогда не покрывал то, что объясняет.
- Объясните поля формы, цены или жаргон прямо там, где возникает вопрос.
- Прикрепите пузырь смещениями, чтобы он очищал меню, липкие заголовки и близлежащие кнопки.
- Проводите пользователей через многоэтапные формы с помощью коротких контекстных подсказок.
Стайлинг: нормальное и зависающее состояния
Разделите триггер и пузырь отдельно. Установите фон, цвет текста, типографику, заполнение, радиус границы, границы и тень коробки. Каждое свойство имеет независимый контроль для нормального состояния и состояния зависания.
- Совпадайте цвета бренда точно, а не с серыми по умолчанию браузером.
- Делайте подсказки тонкими (контур призрака) или громкими (твердая таблетка с тенью) в зависимости от контекста.
- Обратная связь по наведению стилей, чтобы пользователи знали, что элемент интерактивен.
Триггер и анимация
Триггер на hover для быстрых подсказок, нажать для заметок, которые должны оставаться открытыми (это работает лучше на сенсорных экранах), или с пользовательским триггером.Выберите входную анимацию и установить продолжительность и задержку скрыть.Включите Следуйте курсор, если вы хотите, чтобы пузырь следовал за мышью, что подходит карты и диаграммы.
- Наведите курсор на микрокопию рабочего стола; нажмите, чтобы получить постоянные подсказки, удобные для мобильных устройств.
- Тонкий вход с затуханием или масштабированием привлекает внимание, не раздражая пользователя.
- Скрытая задержка предотвращает мерцание подсказки, когда курсор проходит мимо.
Элемент или Расширение: какой вам нужен?
Эта страница (Элемент подсказки, бесплатно): вам нужен новый подсказка на странице Виджет приносит свой триггер, который может быть текстом, значком или изображением.
Расширение всплывающих подсказок (Pro): у вас уже есть кнопка, изображение или заголовок на странице, и вам нужна подсказка, прикрепленная к ней.
Обычные случаи использования
- Формы: “Password нуждается в 12+ символах” рядом с входом, без удлинения формы.
- Таблицы цен: определить “per seat” против “per workspace” в ряд.
- Кнопки: уточнить, что происходит после щелчка (“Карта не требуется”).
- Команда/списки: роль, фрагмент биографии или ярлык контакта при наведении.
- Включение: короткие инструкции рядом с новыми функциями или виджетами информационной панели.
Как добавить всплывающую подсказку в Elementor
- Бросьте виджет.В Elementor выполните поиск по “Tooltip” в разделе "Мастер-аддоны" и перетащите его туда, где принадлежит подсказка.
- Записать и разместить.Введите текст подсказки, установите триггер (наведите или щелкните), выберите размещение и смещения.
- Стиль это. на вкладке Стиль, дизайн Нормальный и Hover состояния: цвета, типографика, радиус, тень. Опубликовать.
- Хотите скриншоты каждой обстановки? Читайте наше руководство дальше как добавить всплывающую подсказку в Elementor.
Часто задаваемые вопросы для подсказки
Для чего нужен элемент Tooltip?
Добавление короткого полезного контекста без загромождения макета: пояснения полей, определения терминов, уточнения кнопок, встроенные инструкции. все несущественное, что помогает, когда об этом просят.
Чем это отличается от расширения Tooltips?
Элемент представляет собой бесплатный автономный виджет со своим триггером. The Расширение ToolTips является частью Pro и прикрепляет всплывающую подсказку к виджету, разделу или контейнеру, который уже на странице. оба имеют Follow Cursor, предустановки размещения и триггеры наведения или щелчка. Нужен новый намек? использовать элемент Нужны всплывающие подсказки по вещам, уже на странице? использовать расширение.
Могу ли я стилизовать нормальные и зависающие состояния отдельно?
Да. На вкладке "Стиль" есть независимые элементы управления "Нормальный" и "Наведение" для фона, текста, границ, радиуса и тени.
Как контролировать, где появляется пузырь?
Используйте предустановки размещения (верхний, нижний, левый, правый, а также начальный и конечный варианты), затем подталкивайте смещения X и Y в пикселях.
Наведите курсор или нажмите: какой триггер мне использовать?
Наведите курсор для быстрых подсказок на рабочий стол; нажмите, чтобы узнать все, что должно работать на сенсорных экранах, поскольку на мобильном телефоне зависания не существует.
Затормозит мой сайт?
Нет. загружает только свои собственные небольшие CSS и JS, когда присутствует на странице. горстка всплывающих подсказок на странице не оказывает заметного влияния.
Виджеты и расширения трендовых элементов
Создавайте сложные веб-сайты за меньшее время.
Стекломорфизм
Дополнительные контейнеры
Шаблоны
Дубликатор сообщений/страниц
