Form Styling
Met Auto Form Builder heb je volledige controle over de vormgeving van je formulieren. Stem de formulieren af op je merkkleuren, gebruik je eigen lettertypen, pas de afstand aan en ontwerp formulieren die naadloos aansluiten op je website.
Waarom vormgeving belangrijk is
Uw website heeft een merkidentiteit. Uw formulieren moeten die identiteit weerspiegelen.
Wanneer formulieren er anders uitzien dan de rest van je website, aarzelen bezoekers. Ze vragen zich af of ze nog wel op dezelfde website zijn. Die aarzeling kost conversies.
Stijlvol vormgegeven formulieren stralen ook professionaliteit uit. Een verzorgd formulier laat bezoekers zien dat u oog hebt voor detail – en als u waarde hecht aan het ontwerp van formulieren, hecht u waarschijnlijk ook waarde aan hun gegevens.
Hoe werkt vormstyling?
Auto Form Builder bevat een visuele stijl-editor die is geïntegreerd in de interface van de formulierbouwer.
- Kies wat je wilt stylenKies uit formuliercontainer, veldlabels, invoervelden, knoppen of foutmeldingen.
- Pas de instellingen aanGebruik kleurenpickers, schuifregelaars en keuzelijsten om waarden te wijzigen. Geen CSS-syntaxis om te leren of te onthouden.
- Bekijk direct een voorbeeldElke wijziging is direct zichtbaar in de live preview. Zie precies hoe uw formulier eruit zal zien voordat u het publiceert.
- Opslaan als standaardinstellingenPas je styling automatisch toe op nieuwe formulieren. Maak het één keer aan en hergebruik het overal.
Wat u kunt aanpassen
Kleur
Beheer elke kleur in je formulier. Achtergrondkleuren voor de formuliercontainer en individuele velden. Tekstkleuren voor labels, placeholders en invoervelden. Randkleuren voor de standaardstatus, focusstatus en foutmelding. Knopkleuren voor achtergrond, tekst en hover-effecten.
Typografie
Kies lettertypen voor labels en invoervelden. Pas de lettergrootte onafhankelijk van elkaar aan: grotere labels voor nadruk, kleinere hulptekst voor aanvullende informatie. Regel de letterdikte voor vetgedrukte labels of lichtere invoertekst.
Afstand en lay-out
Stel de afstand tussen de velden in om voldoende witruimte te creëren. Pas de opvulling binnen de velden aan voor een comfortabele tekstinvoer. Stel de marges rondom het hele formulier in om het perfect in de pagina-indeling te plaatsen.
Randen en hoeken
Definieer de randbreedte, -stijl en -kleur. Rond de hoeken af voor een moderne look of houd ze scherp voor een minimalistisch ontwerp. Pas verschillende randstijlen toe op verschillende formulierstatussen: subtiele randen standaard, prominente randen wanneer het formulier is geselecteerd.
Knopen
Ontwerp verzendknoppen die bij uw merk passen. Achtergrondkleur, tekstkleur, randradius, opvulling, lettergrootte en lettertypegewicht. Pas de hover- en actieve status aan zodat de knoppen responsief en klikbaar aanvoelen.
FormulierContainer
Stijl de algehele formulieromslag. Voeg een achtergrondkleur toe of laat deze transparant. Pas schaduwen toe voor meer diepte. Stel een afgeronde randradius in voor afgeronde formuliercontainers. Beheer de maximale breedte om te voorkomen dat formulieren te breed worden.
Veelvoorkomende scenario's voor formulieropmaak
Match-merkrichtlijnen
Uw bedrijf heeft specifieke kleuren: #0F2D5F voor de primaire kleur en #F59E0B voor de accentkleur. Voer deze waarden in de stijleditor in. Formulierknoppen gebruiken uw accentkleur. Formulierlabels gebruiken uw primaire kleur. Perfecte merkconsistentie.
Maak vormen met een hoog contrast.
Website met een donkere achtergrond? Maak lichte, opvallende formulieren. Website met een lichte achtergrond? Gebruik formulieren met een rand en subtiele schaduwen om het formuliergebied af te bakenen zonder visueel te concurreren.
Ontwerp minimalistische vormen
Verwijder randen, verklein de afstand tussen elementen en gebruik transparante achtergronden. Ontwerp formulieren die naadloos in de pagina overgaan in plaats van los in een kader te staan.
Ontwerp opvallende call-to-action-formulieren
Grote knoppen, felle kleuren, ruime marge. Maak formulieren die de aandacht trekken voor uw belangrijkste pagina's voor leadgeneratie.
Formulieren die bij elk thema passen
Auto Form Builder werkt met elk WordPress-thema. Je gestileerde formulieren passen zich aan elke ontwerpcontext aan.
Gebruik je Woodmart, Astra, GeneratePress, Divi of een ander thema? Je formulieren zien er dan native uit. De stijl-editor biedt je voldoende controle om aan elk ontwerpsysteem aan te sluiten.
Geen themaconflicten. Geen problemen met stijlovererving. Gewoon formulieren die er precies zo uitzien als u wilt.
Geen CSS vereist
Je hoeft geen eigen CSS te schrijven om je formulieren vorm te geven. De visuele editor regelt alles.
Maar als u CSS-controle wilt, biedt Auto Form Builder ondersteuning voor aangepaste CSS per formulier. Voeg overrides toe voor uitzonderlijke gevallen of pas geavanceerde styling toe die niet beschikbaar is in de visuele editor. Gevorderde gebruikers krijgen de flexibiliteit die ze nodig hebben.
