Редактор Wix: добавление и настройка выпадающего меню

6 мин. чтения

Выпадающее меню - это контейнеры, которые вы можете добавить в качестве элементов в расширенное горизонтальное меню. Когда посетители наводят курсор на пункт меню на действующем сайте, открывается контейнер.

Прикрепляйте элементы к контейнеру, чтобы отображать важный и актуальный контент. Вы также можете настроить их внешний вид, чтобы обеспечить уникальную навигацию для посетителей.

GIF выпадающего меню на опубликованном сайте Wix.

Для начала добавьте на страницу горизонтальное меню и установите его как расширенное. Расширенные меню помогут вам создать организованный интерфейс с несколькими вариантами элементов навигации для ваших посетителей.

Важная информация:

Контейнер выпадающего меню можно добавить только в горизонтальное меню, которое вы указали как расширенное. Контейнеры выпадающего меню не поддерживаются в обычных, в стиле шаблона и вертикальных меню сайта.

Чтобы добавить и настроить горизонтальное расширенное меню:

Нажмите Добавить элементы в левой части редактора.
Выберите Меню и якорь.
Выберите Горизонтальные.
Нажмите и перетащите выбранный дизайн меню в любое место на странице.
Установите меню как расширенное:
1. Нажмите на новое меню в редакторе.
2. Нажмите на значок Настройки. .
3. Выберите Установить.
4. Нажмите Установить во всплывающем окне.

Вкладка «Меню и якорь» на панели «Добавить элементы». Курсор находится над горизонтальным меню.

Добавив расширенное горизонтальное меню, добавьте контейнер выпадающего меню в качестве пункта и назовите его. Мы рекомендуем использовать заголовок, который отражает ваш предполагаемый контент, например «Услуги» и «Наша история».

Чтобы добавить выпадающе меню:

Выберите расширенное меню в редакторе.
Нажмите Управлять меню.
Нажмите + Добавить пункт в нижней части панели.
Выберите Выпадающее меню.
Введите название контейнера в поле.
Нажмите Готово.

Панель управления меню для расширенного меню в редакторе. Курсор находится над опцией добавления выпадающего меню.

Шаг 3 | Добавьте контент в контейнер

После того, как вы добавили контейнер и присвоили ему имя, добавьте такие элементы, как кнопки, фигуры и текст, чтобы создать желаемый контент.

Чтобы добавить элементы:

Наведите курсор на контейнер выпадающего меню в панели управления меню.
Нажмите Редактировать.
Нажмите Добавить элементы в левой части редактора.
Выберите элемент, который хотите добавить.
Нажмите и перетащите элемент в выбранное место в контейнере.

GIF, показывающий, как текстовое поле добавляется в контейнер выпадающего меню из панели «Добавить элементы».

После добавления нужных элементов измените макет контейнера выпадающего меню, чтобы он соответствовал структуре вашей страницы. Вы можете настроить интервал и выбрать, насколько растягивается контейнер.

Чтобы изменить макет:

Нажмите на контейнер выпадающего меню.
Нажмите Изменить макет.
Используйте параметры для настройки контейнера:
- Выберите макет: выберите, хотите ли вы, чтобы контейнер растягивался на всю ширину экранов посетителей или на ширину страницы вашего сайта (в пределах линий сетки).
- Расстояние между меню и подменю: увеличьте или уменьшите расстояние между меню и контейнером выпадающего меню, перетащив ползунок.

Панель макета контейнера для выпадающего меню в редакторе Wix. Курсор находится над ползунком интервала.

После того, как вы настроили макет контейнера, настройте его границы, фон и многое другое. Чтобы сохранить единообразный вид, изменения, которые вы вносите в выпадающее меню, также применяются ко всем добавленным вами подменю.

Чтобы настроить дизайн контейнера:

Нажмите Выход из режима на панели режима выпадающего меню.

2. Нажмите на расширенное меню.

3. Нажмите значок Дизайн

4. Нажмите Настроить дизайн.

5. Выберите контейнер подменю в разделе Дизайн чего вы хотите настроить?

6. Используйте параметры для дизайна контейнера.

Посмотреть варианты дизайна

Заливка :
- Нажмите на поле цвета, чтобы выбрать цвет для контейнера меню.
- Перетащите ползунок, чтобы настроить прозрачность.
Границы :
- Нажмите на поле цвета и выберите цвет границы.
- Нажмите на раскрывающееся меню и выберите стиль границы.
- Нажмите значок Замкнуть / Разомкнуть , чтобы выбрать, будут ли все стороны одинаковыми или разных размеров.
- Введите количество пикселей в соответствующие поля, чтобы изменить размер границы.
Уголки :
- Нажмите значок Замкнуть / Разомкнуть , чтобы выбрать, будут ли уголки одинаковыми или разными.
- Введите количество пикселей в поля, чтобы углы стали более округлыми или квадратными.
Тени :
- Нажмите Добавить тень, чтобы добавить тень к контейнеру.
- Перетащите ползунок, чтобы настроить прозрачность тени.
- Нажмите на поле, чтобы настроить тень:
  - Нажмите на поле цвета, чтобы выбрать цвет тени.
  - Выберите тип тени: внешний или внутренний.
  - Введите угол падения тени.
  - Перетащите ползунок, чтобы увеличить или уменьшить расстояние между контейнером и тенью.
  - Используйте ползунок, чтобы настроить размытие тени.
  - Перетащите ползунок, чтобы увеличить или уменьшить тень.
Макет :
- Нажмите значок Замкнуть / Разомкнуть , чтобы выбрать одинаковые или разные размеры отступов.
- Введите количество пикселей, чтобы изменить размер отступов.

GIF, показывающий параметры дизайна для контейнера выпадающего меню, доступного в редакторе Wix.

Примечание:

К выпадающему меню применяются только параметры дизайна, созданные для контейнера подменю. Изменения, которые вы вносите в элементы подменю, не применяются к элементам, которые вы добавили в контейнер выпадающего меню.

Что дальше?

Есть ряд опций, доступных с расширенным горизонтальным меню. Вы можете:

Управлять расширенным меню, чтобы отобразить нужные элементы.
Настроить дизайн в соответствии со стилем сайта.
Настроить макет меню, чтобы установить выравнивание, интервал и многое другое.

Была ли статья полезна?

В этой статье

Шаг 1 | Добавьте и настройке расширенное горизонтальное меню
Шаг 2 | Добавьте выпадающее меню в расширенное меню
Шаг 3 | Добавьте контент в контейнер
Шаг 4 | Настройте макет контейнера выпадающего меню
Шаг 5 | Настройте дизайн выпадающего меню

Шаг 1 | Добавьте и настройке расширенное горизонтальное меню