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

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



Подсказка: детальнее о принципах отображения сайтов на мобильных устройствах смотрите в статье Отображение сайтов на мобильных устройствах.

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

Изменение цвета иконки гамбургер-меню на мобильных

Цвет иконки гамбургер-меню на мобильных устройствах зависит от тёмного или светлого оттенка в цветовой палитре сайта. Так, если у вас тёмный фон шапки сайта, гамбургер-меню будет принимать светлый оттенок из палитры сайта, а если фон шапки светлый, то гамбургер-меню будет принимать тёмный оттенок соответственно.

К примеру, фон шапки на картинке ниже считается тёмным:



Поэтому гамбургер-меню будет принимать цвет светлого оттенка из палитры:



Чтобы изменить цвет иконки гамбургер-меню, перейдите в редактор сайта, нажмите на троеточие на панели управления и откройте вкладку Стиль сайта:



Во вкладке Цвета наведите на текущую палитру сайта и нажмите Редактировать:



Подберите подходящий вам Тёмный или Светлый оттенок в палитре и нажмите Готово:



Опубликуйте сайт, чтобы изменения вступили в силу.

Теперь иконка гамбургер-меню будет отображаться в выбранном цвете:



Изменение цвета фона гамбургер-меню на мобильных

Если вы используете глобальную прозрачную шапку на сайте, гамбургер-меню при раскрытии всё равно будет иметь цвет в роли фона.

Например, вот так выглядит шапка сайта на мобильной версии:



А вот так она выглядит при раскрытии гамбургер-меню:



Чтобы изменить этот цвет, наведите на шапку сайта и перейдите к её настройкам, кликнув на «бегунок»:



Выключите опцию Сделать шапку прозрачной в открывшемся окне:



Теперь перейдите в настройки строки, где находится навигационное меню:



Откройте вкладку Фон и выберите цвет для фона своего гамбургер-меню:



Перейдите обратно в настройки шапки сайта и сделайте её прозрачной как раньше:



Опубликуйте сайт, чтобы изменения вступили в силу.

Готово! Теперь цвет фона в гамбургер-меню будет совпадать с фоном, который вы выбрали для строки в шапке:

Была ли эта статья полезна?
отменить
Спасибо!