Стилизиране на формуляри
Auto Form Builder ви дава пълен контрол върху стила на формулярите. Съчетайте цветовете на вашата марка, използвайте шрифтовете си, регулирайте разстоянието и проектирайте формуляри, които изглеждат като естествена част от вашия сайт.
Защо стилизирането на формата е важно
Вашият уебсайт има бранд. Вашите формуляри трябва да го отразяват.
Когато формулярите изглеждат различно от останалата част от сайта ви, посетителите се колебаят. Те се чудят дали все още са на същия уебсайт. Това колебание им струва реализации.
Стилните формуляри също така предават професионализъм. Изпипаната форма показва на посетителите, че се интересувате от детайлите – а ако ви е грижа за дизайна на формуляра, вероятно се интересувате и от техните данни.
Как работи стилизирането на формуляри
Auto Form Builder включва редактор на визуални стилове, вграден в интерфейса на инструмента за изграждане на формуляри.
- Изберете какво да стилизиратеИзберете от контейнер за формуляри, етикети на полета, полета за въвеждане, бутони или съобщения за грешки.
- Регулирайте настройкитеИзползвайте инструменти за избор на цвят, плъзгачи и падащи менюта, за да променяте стойностите. Няма нужда да учите или запомняте CSS синтаксис.
- Прегледайте незабавния прегледВсяка промяна се показва веднага в предварителен преглед. Вижте точно как ще изглежда формулярът ви, преди да го публикувате.
- Запазване като настройки по подразбиранеПрилагайте стила си автоматично към нови формуляри. Създайте веднъж, използвайте го повторно навсякъде.
Какво можете да персонализирате
Цветове
Контролирайте всеки цвят във формуляра си. Цветове на фона за контейнера на формуляра и отделните полета. Цветове на текста за етикети, заместители и въведен текст. Цветове на границите за състояния по подразбиране, фокус и грешка. Цветове на бутоните за фон, текст и ефекти при задържане на курсора.
Книгопечатане
Изберете шрифтове за етикети и полета за въвеждане. Настройвайте размерите на шрифта независимо – по-големи етикети за акцентиране, по-малък помощен текст за второстепенна информация. Контролирайте дебелината на шрифта за удебелени етикети или по-лек текст за въвеждане.
Разстояние и оформление
Задайте разстояние между полетата, за да създадете пространство за дишане. Регулирайте допълващите полета вътре в полетата за удобно въвеждане на текст. Контролирайте полетата около целия формуляр, за да го позиционирате перфектно в оформлението на страницата.
Граници и ъгли
Определете ширината, стила и цвета на рамката. Заоблете ъглите за модерен вид или ги запазете остри за минималистичен дизайн. Приложете различни стилове на рамката към различните състояния на формуляра – фини рамки по подразбиране, изпъкнали рамки на фокус.
Копчета
Проектирайте бутони за изпращане, които съответстват на вашата марка. Цвят на фона, цвят на текста, радиус на рамката, отстъп, размер на шрифта и дебелина на шрифта. Персонализирайте състоянията на задържане на курсора и активността, така че бутоните да са отзивчиви и кликаеми.
FormContainer
Оформете цялостната обвивка на формуляра. Добавете цвят на фона или го запазете прозрачен. Приложете сенки на полета за дълбочина. Задайте радиус на границата за заоблени контейнери на формуляри. Контролирайте максималната ширина, за да предотвратите разтягането на формулярите твърде широко.
Често срещани сценарии за стилизиране на формуляри
Насоки за съвпадение на марката
Вашата компания има специфични цветове – #0F2D5F за основен, #F59E0B за акценти. Въведете тези стойности в редактора на стилове. Бутоните на формуляри използват вашия акцентен цвят. Етикетите на формуляри използват вашия основен цвят. Перфектна последователност на марката.
Създавайте формуляри с висок контраст
Уебсайт с тъмен фон? Създайте светли форми, които се открояват. Светъл фон? Използвайте рамкирани форми с фини сенки, за да дефинирате областта на формуляра, без да се конкурирате визуално.
Дизайн на минимални форми
Премахнете рамки, намалете разстоянието, използвайте прозрачни фонове. Създавайте формуляри, които се усещат интегрирани в страницата, а не като затворени в кутия.
Създавайте смели формуляри с призив за действие
Големи бутони, наситени цветове, щедро отстъпване. Създавайте формуляри, които привличат вниманието за най-важните ви страници за генериране на потенциални клиенти.
Формуляри, които отговарят на всяка тема
Auto Form Builder работи с всяка WordPress тема. Вашите стилизирани форми се адаптират към всеки дизайнерски контекст.
Използвате Woodmart, Astra, GeneratePress, Divi или друга тема? Вашите формуляри ще изглеждат естествено. Редакторът на стилове ви дава достатъчно контрол, за да се съчетаят с всяка дизайнерска система.
Няма конфликти на теми. Няма проблеми с наследяването на стилове. Само формуляри, които изглеждат точно както искате.
Не се изисква CSS
Не е нужно да пишете персонализиран CSS, за да стилизирате формулярите си. Визуалният редактор се грижи за всичко.
Но ако искате CSS контрол, Auto Form Builder поддържа персонализиран CSS за всяка форма. Добавете замени за гранични случаи или приложете разширено стилизиране, което не е налично във визуалния редактор. Напредналите потребители получават необходимата им гъвкавост.
