Изменение дизайна кнопки
Чтобы сохранить единый дизайн сайта, мы рекомендуем вам настроить вид кнопок в настройках.
Следуйте инструкциям ниже, чтобы изменить цвет кнопки, шрифт текста в ней и прочее.
Вы также можете посмотреть нашу видео-инструкцию на эту тему:
Нажмите на иконку Стиль сайта слева на панели управления:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/ru1_1kd6da.png)
Перейдите во вкладку Кнопки в открывшемся окне и выберите один из готовых вариантов в галерее:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1056-6_1ktn9wk.png)
Если вы хотите самостоятельно настроить вид кнопки, наведите на текущий стиль кнопки и нажмите Редактировать:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1057-2_7yqp3y.png)
В новом окне выберите тип кнопки Primary или Secondary и кликните на нужную, чтобы перейти к редактированию:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1058-2_pzfu57.png)
Подсказка: здесь вы можете изменить шрифт, который используется для текста в кнопках, а также его форматирование:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1059-2_oibm9a.png)
После выбора типа кнопки в новом окне вы сможете изменить цвет заливки, текста и границ кнопки:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1060-4_9tbkcp.png)
Важно: не забудьте отдельно настроить дизайн кнопок для тёмного фона:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1061-4_1q1euaq.png)
По завершению редактирования кнопок кликните Готово.
Чтобы изменить дизайн для конкретной кнопки на сайте, кликните на неё и нажмите на «бегунок», чтобы перейти к настройкам:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1062-2_1mwmzwl.png)
Откройте вкладку Стиль в новом окне и выберите подходящий тип (Основная, Второстепенная или Ссылка), стиль и размер кнопки:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1063-2_1u81a25.png)
Подсказка: выбирайте Основной тип для кнопок с призывом к важному действию например, «Отправить заявку» и так далее. Второстепенный тип больше подходит для кнопок с призывом чуть меньшего значения например, «Посмотреть портфолио». Тип Ссылка предназначен для показа дополнительной информации например, «Узнать больше».
Помимо этого, вы можете добавить иконку в кнопку, а также изменить её выравнивание относительно текста:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1064-1_q6if3g.png)
Не забудьте опубликовать свой сайт, чтобы изменения вступили в силу.
Примечание: добавьте переход с кнопки на сторонний ресурс, другую страницу или блок, следуя инструкциям в статье Добавление ссылок на элементы.
Следуйте инструкциям ниже, чтобы изменить цвет кнопки, шрифт текста в ней и прочее.
Вы также можете посмотреть нашу видео-инструкцию на эту тему:
Шаг 1. Изменение дизайна кнопок в глобальных настройках
Нажмите на иконку Стиль сайта слева на панели управления:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/ru1_1kd6da.png)
Перейдите во вкладку Кнопки в открывшемся окне и выберите один из готовых вариантов в галерее:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1056-6_1ktn9wk.png)
Если вы хотите самостоятельно настроить вид кнопки, наведите на текущий стиль кнопки и нажмите Редактировать:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1057-2_7yqp3y.png)
В новом окне выберите тип кнопки Primary или Secondary и кликните на нужную, чтобы перейти к редактированию:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1058-2_pzfu57.png)
Подсказка: здесь вы можете изменить шрифт, который используется для текста в кнопках, а также его форматирование:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1059-2_oibm9a.png)
После выбора типа кнопки в новом окне вы сможете изменить цвет заливки, текста и границ кнопки:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1060-4_9tbkcp.png)
Важно: не забудьте отдельно настроить дизайн кнопок для тёмного фона:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1061-4_1q1euaq.png)
По завершению редактирования кнопок кликните Готово.
Шаг 2. Изменение стиля конкретной кнопки
Чтобы изменить дизайн для конкретной кнопки на сайте, кликните на неё и нажмите на «бегунок», чтобы перейти к настройкам:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1062-2_1mwmzwl.png)
Откройте вкладку Стиль в новом окне и выберите подходящий тип (Основная, Второстепенная или Ссылка), стиль и размер кнопки:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1063-2_1u81a25.png)
Подсказка: выбирайте Основной тип для кнопок с призывом к важному действию например, «Отправить заявку» и так далее. Второстепенный тип больше подходит для кнопок с призывом чуть меньшего значения например, «Посмотреть портфолио». Тип Ссылка предназначен для показа дополнительной информации например, «Узнать больше».
Помимо этого, вы можете добавить иконку в кнопку, а также изменить её выравнивание относительно текста:
![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1064-1_q6if3g.png)
Не забудьте опубликовать свой сайт, чтобы изменения вступили в силу.
Примечание: добавьте переход с кнопки на сторонний ресурс, другую страницу или блок, следуя инструкциям в статье Добавление ссылок на элементы.
Обновлено на: 29/04/2024
Спасибо!