Editor X: Использование лейаутеров
6 мин. чтения
Editor X переходит на Wix Studio, нашу новую платформу для агентств и фрилансеров.Подробнее о Wix Studio
Организуйте свой контент в лейаутере, интеллектуальном инструменте макета, состоящем из адаптивных контейнеров. Используя адаптивную технологию, контейнеры автоматически подстраиваются под размер экрана вашего посетителя.
Вы можете выбирать вариант отображения лейаутера (например, колонки, кирпичи, слайдер), добавлять и удалять элементы по мере необходимости и настраивать такие параметры, как поля и направление.
Содержание:
Добавление лейаутера
Откройте панель «Добавить», чтобы выбрать пресет лейаутера и перетащить его на страницу. Существует множество вариантов дизайна в зависимости от типа контента, который вы хотите отобразить (например, только изображения, изображения и текст и т. д.)
Чтобы добавить лейаутер:
- Нажмите Добавить элементы
в верхней части Editor X. - Нажмите Для лейаута.
- Нажмите Лейаутеры.
- Перетащите лейаут на страницу.
Посмотрите, как это работает:
Перетащите маркеры, чтобы увидеть, как содержимое лейаутера плавно реорганизуется между размерами экрана.
Добавление элементов лейаутера и управление ими
Лейаутер состоит из нескольких элементов, которые являются адаптивными контейнерами. Вы можете изменить количество элементов в лейаутере, и он автоматически изменит размер элементов в соответствии с доступным пространством.
Чтобы добавить новый элемент, вы можете нажать Добавить элемент или использовать панель Управлять в Инспекторе.
Чтобы управлять элементами лейаутера в Инспекторе:
- Нажмите на лейаутер.
- Нажмите на значок Инспектора
в верхней части Editor X. - (В Инспекторе) Нажмите Управлять рядом с количеством элементов.
- Нажмите на значок Другие действия
рядом с элементом, чтобы выполнить одно из следующих действий:
- Создать копию: создание копии определенного элемента.
- Переименовать: дайте каждому элементу название, которое вы сможете узнать.
- Удалить: полностью удалить элемент.
- Скрыть: скройте этот элемент для определенного размера экрана, над которым вы работаете.
Хотите изменить расположение элементов?
Удерживайте значок изменения порядка 
рядом с соответствующим элементом и перетащите его на новое место.
рядом с соответствующим элементом и перетащите его на новое место. Настройка отображения лейаутера
Измените отображение лейаутера в один клик. Вы можете выбрать, как вы хотите представить свой контент — в колонках, рядах, в форматах мозаики, слайдера или слайд-шоу. Элементы автоматически изменять свое расположение.
Работа с экранами разных размеров:
- Вы можете установить различный лейаутер для каждого размера экрана.
- Мы рекомендуем лейаут колонки или слайдера на небольших экранах, например, на мобильных устройствах.
Для дальнейшей настройки отображения:
- Нажмите на лейаутер.
- Нажмите на панель Инспектора
в правом верхнем углу Editor X. - (Необязательно) В разделе Отображение выберите Тип отображения.
- Настройте лейаутер на основе выбранного типа отображения:
Колонки: варианты макета
Ряды: варианты макета
Кирпичи: варианты макета
Мозаика: варианты макета
Слайдер: варианты макета
Слайды: варианты макета
Примечание об отступах в CSS:
Некоторые старые браузеры не поддерживают эту функцию (например, Chrome 76-83, Safari 12-14 и Edge 79-83). Это означает, что посетители, которые заходят на ваш сайт с помощью этих браузеров, не увидят отступов, которые вы устанавливаете для элементов лейаутера.
Изменение размера элементов лейаутера
Элементы лейаутера не обязательно должны быть одинакового размера. Вы можете изменить размер отдельных элементов, чтобы сделать их больше или меньше остальных. Из панели Инспектора, настройте ширину и высоту каждого элемента, используя единицы измерений по вашему выбору. Вы также можете настроить горизонтальные и вертикальные поля вокруг элементов.
Изменение порядка расположения элементов лейаутера
Измените порядок содержимого внутри лейаутера, изменив порядок элементов. Используя контекстное меню, вы можете перемещать элементы вперед и назад - лейаутер автоматически подстраивается под ваши изменения.
Чтобы изменить порядок элементов лейаутера:
- Нажмите правой кнопкой мыши на элемент, который вы хотите переместить.
- Наведите курсор на Поменять местами.
- Выберите Со следующим элементом / С предыдущим элементом.
Была ли статья полезна?
|