Добавьте кнопку «Меню» в меню вашего сайта

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

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

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

В этой статье:


Добавить кнопку меню

  • Нажмите на Параметры (3) вкладка, где вы увидите возможность настройки Кнопка меню (4).

Кроме того, вы можете воспользоваться функцией поиска Pixpa, чтобы перейти к разделу «Кнопки меню».

  • Enter кнопка меню (1) в строке поиска.
  • Вы увидите соответствующие результаты.
  • Нажмите на Кнопка меню – заголовок веб-сайта вариант (2) под Ссылки на студию. 

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


Параметры кнопки меню

  1. Показать кнопку – Включить/Выключить Кнопка меню на вебсайте.
  2. Ссылка на сайт - Нажмите на Конструктор ссылок значок для выберите страницу или ссылку, которую вы хотите подключить с помощью кнопки меню.
  3. Этикетка - Укажите этикетка для кнопки меню.
  4. Размер кнопки – Выберите Размер кнопки от Маленький, средний или большой.
  5. Целевое окно – Установить целевое окно чтобы кнопка меню открывалась в То же окно или новое окно.
  6. Стиль кнопки – Выберите стиль кнопки, который будет использоваться по умолчанию (задано в Кнопки и ссылки вкладку раздела «Дизайн»), Solid, Outline или Text Link.
    • По умолчанию: Соответствует настройкам темы вашего сайта.
    • Solid: Кнопка с жирным шрифтом и заливкой.
    • Outline: Прозрачный фон с рамкой.
    • Текстовая ссылка: Простой, понятный стиль, состоящий только из текста (без кнопок).
  7. Значок кнопки – Добавьте значок рядом с надписью кнопки. Вы можете выбрать один из нескольких вариантов значка.
  8. Планировка – Управляйте расположением значка относительно этикетки. Доступны следующие варианты макета:
    • Метка + Значок: Сначала появляется текст, а затем значок.
    • Значок + Метка: Сначала появляется значок, затем текст.
    • Метка + Значок (Широкий): Текст и значки расположены с большим отступом, что подходит для более широких кнопок.
    • Значок + Метка (широкая): Сначала иконки, шире отступы.
  9. Цвет значка – Выберите цвет значка кнопки. Вы можете выбрать текст кнопки цвет или Бренд цвет.


Цвета кнопок меню

Используйте панель «Цвета кнопок меню», чтобы настроить внешний вид кнопки в навигации вашего сайта. Эти настройки позволяют полностью контролировать цвет текста и цвет фона как для обычных заголовков, так и для прозрачных или пользовательских заголовков.

  1. Укажите цвет – Выберите способ наследования цветов кнопкой меню.
    • По умолчанию: Наследует настройки темы.
    • Инвертировать: Изменяет цвета текста и фона кнопки.
    • Таможня: Позволяет выбирать определенные цвета текста и фона.
  2. текст кнопки - При использовании Пользовательский цвет кнопкиВы можете установить цвет текста (метки) отсюда.
  3. Фон кнопки – Этот параметр также доступен в разделе «Пользовательский» и задаёт цвет фона кнопки. Сочетайте его с цветом текста для максимальной читабельности и стиля.
  4. Переопределение прозрачного/пользовательского заголовка – Если на вашем сайте используется прозрачный или нестандартный дизайн заголовка, вы можете активировать эту опцию, чтобы применить отдельный набор цветов специально для этого стиля заголовка. Вы также можете настроить цвет кнопок меню для каждой страницы.
  5. Укажите цвет – Выберите, как кнопка должна отображаться в прозрачных или пользовательских заголовках.
    • По умолчанию: Наследует настройки темы.
    • Инвертировать: Изменяет цвета текста и фона кнопки.
    • Таможня: Позволяет выбирать определенные цвета текста и фона.
    • Цвет меню страницы: Применяет цвет элемента, заданный для конкретной страницы, в качестве цвета кнопки, обеспечивая автоматическое соответствие кнопки меню стилю этой страницы.

  6. текст кнопки - При использовании Пользовательский цвет кнопкиВы можете установить цвет текста (метки) отсюда.
  7. Фон кнопки – Этот параметр также доступен в разделе «Пользовательский» и задаёт цвет фона кнопки. Сочетайте его с цветом текста для максимальной читабельности и стиля.


Пример кнопки меню на веб-сайте

Посмотрите демонстрационную версию кнопки «Меню» на сайте.


Не можете найти то, что ищете?

Свяжитесь с экспертом Pixpa.

Pixpa Studio только что обновили. В данный момент мы обновляем скриншоты всех справочных статей.