Настройка и настройка пользовательских точек останова элементара с помощью главных надстроек #
Функция пользовательских точек останова элементара доступна через Мастер Аддоны Про (или до 3 точек останова в бесплатной версии), позволяет создавать полностью адаптивные макеты веб-сайтов оптимизирован для более широкого диапазона размеров экрана, выходящего за рамки настроек Elementor по умолчанию для мобильных устройств, планшетов и настольных компьютеров. Это обеспечивает стабильное и качественное взаимодействие с пользователем на любом устройстве.
Используя Пользовательские точки останова элементара, вы можете
- Добавьте столько пользовательских точек останова (ширина экрана), сколько необходимо (без ограничений с помощью Master Addons Pro).
- Определите конкретные макеты, размеры шрифтов, расстояние и выравнивание для таких устройств, как Small Mobile, Large Tablet или пользовательские размеры экрана.
- Переопределить адаптивное поведение Elementor по умолчанию при точной ширине пикселей.
Каковы пользовательские контрольные точки элементара? #
Пользовательские точки останова Elementor - это дополнительные, определяемые пользователем пороговые значения ширины экрана, которые позволяют вашему макету адаптироваться в размерах, выходящих за рамки встроенных представлений Elementor для мобильных устройств, планшетов и рабочих столов. Вместо того, чтобы ограничиваться тремя представлениями устройств, вы устанавливаете точную максимальную ширину (в пикселях), где должна начинаться новая адаптивная раскладка 600px для маломобильной точки останова. Главные дополнения добавляют до 3 пользовательских точек останова в свободном плане и неограниченных точек останова с Pro, что дает вам точный контроль над адаптивным дизайном без прикосновения к коду.
Итак, посмотрим, как настроить и настроить эту функцию.
Настройка пользовательских точек останова элементара #
Быстрый ответ: установите расширение Custom Breakpoints с Мастер-аддоны > Расширение, открой новое Точки останова страница в меню "Мастер-аддоны", затем введите a Максимальная ширина в пикселях для каждого размера устройства, на которое вы хотите ориентироваться (например, 600px для маленького мобильного).
Выполните следующие действия, чтобы установить и определить пользовательские точки останова.
Шаг 1: Установите и активируйте расширение #
- Перейти к Мастер Аддоны меню на панели управления WordPress.
- Иди в Расширение вкладка.
- Найдите “Custom Breakpoints” выберите вариант и нажмите кнопку загрузки, чтобы установить и активировать его на своем веб-сайте.
Шаг 2: Получите доступ к настройкам точек останова #
- На панели управления WordPress наведите курсор на панель управления Мастер Аддоны меню.
- Новый пункт меню под названием “Breakpoints” появится. нажмите на него. это перенаправит вас на пользовательскую страницу ввода точки останова.
Шаг 3: Добавьте пользовательские точки останова #
На странице ввода "Точки останова" вы увидите три точки останова Elementor по умолчанию (Мобильный, Планшети Рабочий стол).
Чтобы добавить новую пользовательскую точку останова, используйте поле ввода, чтобы установить только Максимальная ширина (в пикселях).
Например, чтобы нацелиться на небольшие мобильные устройства, введите 600px как максимальная ширина.
После сохранения система автоматически настроит Min-Width для следующей точки останова по умолчанию В приведенном выше примере точка останова “Small Mobile” будет применяться ко всем экранам меньше или равно 600px, в то время как точка останова “Mobile” по умолчанию будет начинаться с 601px и заканчивают на минимальной ширине точки останова Планшета.
При необходимости вы можете добавлять или удалять точки останова на этой странице.
Использование пользовательских точек останова элементара #
После настройки в настройках Главных Аддонов пользовательские точки останова становятся доступными непосредственно в редакторе страниц Elementor.
Шаг 1: Откройте режим реагирования в Элементоре #
Перейдите на любую страницу и нажмите “Править с Elementor.” Нажмите « Отзывчивый режим значок (обычно монитор и значок телефона) в левом нижнем углу панели.
Шаг 2: Выберите пользовательскую точку останова #
На верхней панели будут отображаться все доступные точки останова, включая созданные вами настраиваемые (например, “Small Mobile”).
Нажмите на свой Пользовательская точка останова чтобы изменить представление редактора на этот конкретный размер экрана.
Шаг 3: Примените пользовательские стили #
Выберите любой элемент (например, виджет заголовка).
Перейти к стихии Стиль вкладка.
Нажмите « Отзывчивый значок (настольный монитор) рядом с любой настройкой стиля, например Типографика > Размер или Содержание > Выравнивание.
Определите конкретное значение для этой точки останова (например, установите размер шрифта 20px). это значение будет применяться только тогда, когда ширина браузера находится в пределах диапазона, определенного для этой пользовательской точки останова.
Шаг 4: Сохранить и просмотреть #
После того, как вы определили свои стили реагирования для всех необходимых точек останова, нажмите Обновить для сохранения страницы.
Предварительный просмотр страницы в реальном времени и изменение размера окна браузера, чтобы увидеть, как ваши пользовательские точки останова запускают определенные вами уникальные стили.
Часто задаваемые вопросы #
Сколько пользовательских точек останова я могу добавить в Elementor?
Master Addons добавляет до 3 пользовательских точек останова в бесплатном плане и неограниченное количество точек останова Мастер Аддоны Про. Каждая точка останова представляет собой экран дополнительной максимальной ширины, расположенный поверх представлений Elementor по умолчанию для мобильных устройств, планшетов и рабочих столов полностью отзывчивые макеты.
Как добавить пользовательскую точку останова в Elementor?
Установите расширение Custom Breakpoints с вкладки Расширение Master Addons, откройте новую страницу Breakpoints в меню Главные надстройки и введите Max-Width в пикселях (англ.) для примера 600px для небольших мобильных устройств После сохранения новая точка останова появляется в адаптивном режиме Elementor, готовом к стилю.
Требуются ли пользовательские точки останова Elementor Pro?
Нет. Пользовательские точки останова: а Функция "Мастер-аддоны", а не функция Elementor Pro. бесплатный плагин Master Addons дает вам до 3 пользовательских точек останова, и только более высокий предел требует Master Addons Pro.
Нужно ли мне устанавливать минимальную ширину для каждой точки останова?
Нет. Вы вводите только максимальную ширину. Основные дополнения автоматически регулируют минимальную ширину следующей точки останова, поэтому диапазоны никогда не перекрываются — например, точка останова малого мобильного телефона с разрешением 600px позволяет начать просмотр мобильного телефона по умолчанию с разрешением 601px.
Замедляют ли пользовательские точки останова мой сайт?
Нет.Точки останова добавляют только стандартные CSS медиа-запросы, которые являются легкими, а установленные вами стили загружаются точно так же, как встроенные адаптивные стили Elementor. Следуя общему Лучшие практики скорости Элементора поддерживает скорость страницы независимо от того, сколько точек останова вы используете.
