Настройка и настройка пользовательских точек останова элементара с помощью главных надстроек #
Бесплатный Пользовательские точки останова для Elementor плагин из главных аддонов (3 пользовательских точки останова бесплатно, без ограничений с главными аддонами Pro) позволяет создавать полностью адаптивные макеты веб-сайтов оптимизирован для размеров экрана, выходящих за рамки встроенных представлений устройств Elementor. Это обеспечивает стабильное и качественное взаимодействие с пользователем на любом устройстве.
Используя Пользовательские точки останова элементара, вы можете
- Добавьте столько пользовательских точек останова (ширина экрана), сколько необходимо (без ограничений с помощью Master Addons Pro).
- Определите конкретные макеты, размеры шрифтов, расстояние и выравнивание для таких устройств, как Small Mobile, Large Tablet или пользовательские размеры экрана.
- Переопределить адаптивное поведение 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?
Нет. Пользовательские точки останова: а Плагин Master Addons, а не функция Elementor Pro. бесплатный плагин Custom Breakpoints дает вам до 3 пользовательских точек останова, и только более высокий предел требует Master Addons Pro.
Нужно ли мне устанавливать минимальную ширину для каждой точки останова?
Нет. Вы вводите только максимальную ширину. Основные дополнения автоматически регулируют минимальную ширину следующей точки останова, поэтому диапазоны никогда не перекрываются — например, точка останова малого мобильного телефона с разрешением 600px позволяет начать просмотр мобильного телефона по умолчанию с разрешением 601px.
Замедляют ли пользовательские точки останова мой сайт?
Нет.Точки останова добавляют только стандартные CSS медиа-запросы, которые являются легкими, а установленные вами стили загружаются точно так же, как встроенные адаптивные стили Elementor. Следуя общему Лучшие практики скорости Элементора поддерживает скорость страницы независимо от того, сколько точек останова вы используете.
Сравнение со встроенными точками останова Elementor и живой демо-версией см. в Страница плагина Custom Breakpoints.
