> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.weblium.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Настройка стиля контактной формы

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

| ${color}[#1aa900](Подсказка:)если вы хотите установить контактную форму на своём сайте, обратитесь к статье [Добавление контактной формы](https://help.weblium.com/ru/article/dobavlenie-kontaktnoj-formy-g52hxq/).

Содержание:
[Настройка вида контактной формы](#1-nastrojka-vida-kontaktnoj-formy)
[Настройка дизайна кнопки контактной формы](#1-nastrojka-dizajna-knopki-kontaktnoj-formy)
[Настройка дизайна полей контактной формы](#1-nastrojka-dizajna-polej-kontaktnoj-formy)

# Настройка вида контактной формы

1. Наведите курсор на контактную форму на вашем сайте и нажмите на «шестеренку»:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_w05hqy.png)
2. Перейдите на вкладку **Вид**, где вы сможете изменить расположение полей с вертикального на горизонтальное и наоборот:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_l3ymbu.png)
# Настройка дизайна кнопки контактной формы

1. Откройте редактор своего сайта, наведите на нужную контактную форму и нажмите на «бегунок»:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_xkilvo.png)
2. В окне настроек формы перейдите во вкладку **Стиль** и выберите раздел **Кнопка**: 
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_15w8tj6.png)
3. Здесь вы сможете изменить текст, отображаемый в кнопке, а также его начертание — сделать текст жирным, добавить курсив или подчеркивание:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_1g8z7yi.png)
| ${color}[#1aa900](Подсказка:)шрифт в кнопке автоматически подстраивается под общий шрифт сайта. Детальнее об этом вы можете почитать в статье [Изменение шрифта на сайте](https://help.weblium.com/ru/article/izmenenie-shrifta-na-sajte-1t1brog/).

4. Вы также можете выбрать стиль для кнопки, который вы настроили в глобальных настройках, или выбрать альтернативный:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_1877a1a.png)
|| ${color}[#ffa800](Примечание:)для того, чтобы изменить дизайн кнопок на сайте, обратитесь к статье [Изменение дизайна кнопки](https://help.weblium.com/ru/article/izmenenie-dizajna-knopki-1xt931r/).

5. Помимо этого вы можете добавить иконку в кнопку, а также изменить её выравнивание относительно текста: 
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_17337ji.png)
# Настройка дизайна полей контактной формы

1. Во вкладке **Стиль** в настройках формы перейдите в раздел **Поля**, чтобы отредактировать вид полей:
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_ucz44g.png)
2. Здесь вы можете выбрать тип полей — как именно будут отображаться границы для полей: 
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_1m33fmk.png)
3. Помимо этого, вы можете настроить цвет отдельно для каждого компонента в форме — границ, заливки, описания и самого текста в поле: 
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/nalashtuvannya-stilyu-kontaktn_x7qakl.png)
Не забудьте [опубликовать свой сайт](https://help.weblium.com/ru/article/publikaciya-sajta-1xvrq6l/), чтобы изменения вступили в силу. 

| ${color}[#1aa900](Подсказка:)не забудьте персонализировать поля в контактной форме, следуя инструкциям в статье [Настройка полей в контактной форме](https://help.weblium.com/ru/article/nastrojka-polej-kontaktnoj-formy-1tktj0d/).