Het contactformulier dient als een cruciaal hulpmiddel om de communicatie tussen individuen of bedrijven te vergemakkelijken. Het biedt een handige en georganiseerde manier voor gebruikers om contact op te nemen en hun vragen te uiten. U kunt er ook toepassingen, contactvragen en opiniepeilingen mee doen.
U kunt eenvoudig een contactpagina op uw website maken met behulp van het gedeelte Contact.
In dit artikel:
-
- Contactsectie aan een pagina toevoegen
- Beheer contactformulier
- Inhoud contactformulier
- Formuliervelden beheren
- Soorten velden
- Inline-formulier en pop-upformulier
- Lay-out beheren
- Stijl contactformulier
- Contactformulierinstellingen
- Formulier omleiden naar een andere pagina
- Formuliergegevens exporteren
- E-mailberichten
- Ingediende formuliergegevens
- Live voorbeeld
Contactsectie aan een pagina toevoegen
- Op jouw pagina, Klik op de blauw + icoon om een nieuwe sectie aan uw pagina toe te voegen.
- U ziet nu de Sectie Categorieën aan de linkerkant.
- Kies de Formulieren (1) categorie en klik op de Contact tabblad (2) waar u uit kunt kiezen verschillende indelingen van de Contact (3) sectie.
- Kies een sectielay-out en klik erop om deze aan uw pagina toe te voegen.
Beheer contactformulier
- Klik op Bewerk inhoud (1) knop.
- U krijgt de mogelijkheid om te beheren Beschrijving (2) Layout (3) Style (4) settings (5), en E-mailberichten (6).
- Hit Opslaan (7) om de wijzigingen op het formulier toe te passen.
Inhoud contactformulier
Dit is een belangrijk onderdeel van het formulier, aangezien u de afbeelding uploadt of wijzigt, hier een titel en beschrijving geeft, zodat gebruikers een idee krijgen van het doel van het formulier zelf. Door zorgvuldig een beknopte, beschrijvende titel en een informatieve, overtuigende beschrijving te maken, kunt u de communicatie verbeteren en een sterke band opbouwen met de bezoekers van uw website.
Formuliervelden beheren
Onder Formuliervelden beheren kunt u de velden specificeren waarvan u wilt dat bezoekers dit formulier invullen.
- Klik op Nieuw veld toevoegen (1) knop om meer velden aan uw formulier toe te voegen.
- Bewerken of verwijderen (2) een reeds toegevoegd veld.
- Slepen en neerzetten (3) de velden om hun volgorde in het formulier te wijzigen.
- Kies het Label voor de oproepknop (4) voor het formulier.
Het veld E-mail is verplicht op het formulier en kan niet worden verwijderd.
Door te klikken op de + Veld toevoegen knop zal een pop-up openen van waaruit u uw formuliervelden kunt kiezen.
- Leg de naam van uw cliënt.
- Leg kleine informatie vast via de Korte tekst veld.
- Leg uitgebreide informatie/berichten vast via de Lange tekst veld.
- Leg de email van uw cliënt.
- Leg alles vast numerieke informatie van uw cliënt.
- Voeg services toe om uit te kiezen in een laten vallen manier.
- Enkele selectie: Voeg een radioselectie toe voor uw services.
- Meervoudige selectie: Voeg een selectievakje toe voor meerdere selecties.
- Voeg een datumkiezer zodat uw klanten voor elk evenement een datum kunnen kiezen.
- Voeg een lijn tussen de formuliervelden.
- Leg de adres van uw cliënt.
- Leg de website van uw cliënt.
- Leg de Telefoon aantal van uw cliënt.
- Voeg een Time to zodat uw klanten zelf de tijd van het evenement kunnen specificeren.
- Voeg een afscheider tussen de formuliervelden.
- De toestemmingsveld optie kan worden gebruikt om toestemming te vragen voor nieuwsbrieven, privacy en gebruiksvoorwaarden te accepteren.
- Neem beoordelingen van klanten met behulp van de star schaal, nummer schaalen smiley schaal.
- Bij het toevoegen van bepaalde velden krijgt u de mogelijkheid om de breedte te kiezen tussen Volledig, Half en Eenderde
- U kunt er ook voor kiezen om velden naast elkaar weer te geven door de optie Half of One Third te kiezen
Vormstijl
- Formulier weergeven als pop-up – Schakel deze optie in om het formulier in een pop-upvenster te openen wanneer u op de call-to-action-knop klikt.
- Label voor de call-to-action-knop – Stel de Label voor de oproepknop voor het formulier.
- Koptekst pop-up – Geef het formulier op Kop, indien aanwezig.
- Uploaden of verwijderen (1) het formulierbeeld voor het formulier.
- Voeg een Onderwerp (2), en Beschrijving (3) voor het formulier. Controleer voordat u de beschrijving toevoegt dit artikel.
Opschrift
- Opschrift – Geef de Sectie Kop (1) voor het gedeelte Betalingsformulier.
- Knop & Pictogrammen – Meer informatie over Knoppen en pictogrammen (2).
Het beheren van de lay-out
- Klik op Bewerk inhoud (1) knop.
- Kies de Layout (2) tabblad.
- Selecteer het lay-out voor uw sectie (3) en Opslaan (4) de veranderingen.
Als u de lay-out wijzigt, wordt de standaardstijl van het formulier toegepast.
Stijl contactformulier
Het vormgeven van een contactformulier is een belangrijk aspect van het creëren van een visueel aantrekkelijke en gebruiksvriendelijke ervaring.
Je hebt meerdere stijlopties voor de sectie:
- Formuliervelden
- Uitlijning
- Tekst
- Spacing
- Opschrift
- Afbeeldingen
- Afbeeldingsrand
- Pop-upknop
- Formulierknop
- Koptekstknoppen
- Koptekst sociale pictogrammen
Formuliervelden
Pixpa toestaat helpen naar geheel aan te passen the uiterlijk of jouw formulier te worden. Deze styling opties dit toepassen naar allen invoer velden in jouw Contact Form en geven helpen meer onder controle te houden over hoe jouw formulier er gezonder uitzien en voelt zich on jouw website.
- Vorm: Kies de vorm van uw invoervelden, bijvoorbeeld rechthoekig, afgerond, pilvormig of tekstvormig, zodat deze bij de stijl van uw website past.
- in te vullen: Schakel deze schakelaar in om een achtergrondkleur toe te passen op uw formuliervelden.
- Basis kleur: Stel de achtergrondkleur van de velden in wanneer de vuloptie is ingeschakeld.
- Overzicht: Schakel de rand (omtrek) voor elk veld in of uit.
- Omtrekkleur: Kies de kleur van de rand van het veld wanneer de omtrek is ingeschakeld.
- Veldtekstkleur: Stel de kleur in van de tekst die gebruikers in de formuliervelden typen.
- Hoogte: Pas de hoogte van uw velden aan door te kiezen uit: Klein, Gemiddeld, Groot of Extra Groot.
- labels: Kies of formulierveldlabels binnen of buiten het veld worden weergegeven.
- Label kleur: Definieer de kleur van labels wanneer ze buiten het veld worden geplaatst.
- Label Binnenkleur: Stel de kleur in voor labels die in het veld worden geplaatst (handig voor labels in tijdelijke aanduidingen).
- Afstand tussen velden: Gebruik de schuifbalk om de verticale afstand (in pixels) tussen elk formulierveld in te stellen.
Uitlijning
- Beheer de uitlijning van de formulierinhoud horizontaal vanuit Horizontale uitlijning (1).
- Beheer de uitlijning van de formulierinhoud verticaal vanuit Verticale uitlijning (2).
Tekst
- Klik op de Tekststijl wijzigen (1) knop om de Design sectie en beheer uw lettergroottes en -stijlen.
- Geef het Onderwerp (2) lettertype van het formulier.
- Geef het Beschrijving (3) lettertype van het formulier.
Spacing
- Geef het Breedte afbeelding (1) van de afbeelding in het formulier in Procent.
- Geef het Ruimte tussen afbeelding en tekst (3) in procenten.
- Geef het Ruimte onder titel (4) in procenten.
Opschrift
- Horizontaal uitlijnen de sectiekoptekst. U kunt deze instellen op Links, Midden en Rechts.
- Inschakelen/uitschakelen van de verdeler tussen de sectiekop en de sectie-inhoud.
- Kies het dikte van de verdeler (in px).
- Geef het Divider kleur van kleurenkiezer.
- Kies een Scheidingsstijl in de vervolgkeuzelijst.
- Kies het Breedte van de kop om te bepalen hoe breed de sectietitel wordt weergegeven, met een minimum van 50%.
- Geef het Ruimte onder de kop binnen de sectie (in px).
Afbeeldingen
- Afbeelding bijsnijden: Kies de Imagiër gewas voor de lijstitems. U kunt de afbeeldingen instellen als Vierkant, Cirkel, Horizontaal, Portret en Origineel.
- Hoekradius: Kies voor een gemeenschappelijke hoekradius of een andere hoekradius voor elke zijde van de lijstitems en stel een getal in (in px) voor de Cor straal van de lijstitemafbeeldingen. Meer weten.
- Zweefanimatie: Kies voor Animeer de afbeelding van de sectie bij zweven door de schakelaar in te schakelen. Bekijk deze functie op een live pagina.
- Animatiestijl: Kies een Animatiestijl voor afbeelding wanneer de cursor erover beweegt.
- Vormmasker: Schakel deze schakelaar in om een vormmasker toe te passen op de afbeeldingen in de sectie Afbeeldingenlijst. Zodra ingeschakeld, zal de geselecteerde vorm de afbeelding visueel in die vorm knippen.
- Selecteer vorm: Kies uit verschillende vooraf gedefinieerde vormen om toe te passen op uw afbeeldingen. Hiermee kunt u uw content creatief stylen door afbeeldingen weer te geven in unieke vormen zoals rond, diamant, druppel, etc.
De hoekradius veld, kunt u verschillende vormen van afbeeldingen van lijstitems maken. Als u hier 500 px opgeeft, worden de afbeeldingen in een cirkelvorm weergegeven.
- Als u gesplitste hoeken heeft gekozen, kunt u voor elke hoek een andere hoekradius instellen.
Afbeeldingsrand
- Rand in-/uitschakelen door de schakelaar om te zetten.
- Kies ervoor om een gemeenschappelijke grens aan alle kanten van de afbeelding of u kunt de grenzen apart voor elke kant.
- Geef het Breedte van de grens. Als deze is ingesteld op 0, wordt de rand niet weergegeven. U heeft ook de mogelijkheid om de randbreedte voor elke zijde van de afbeelding afzonderlijk in te stellen.
- Selecteer het Rand kleur van kleurenkiezer.
- Selecteer een voorkeur Border Style in de vervolgkeuzelijst.
- Bepalen randbreedte voor mobiel apparaten, waarbij het wordt uitgelijnd met de gekozen breedte voor het bureaublad.
Pop-upknop
Deze stijlopties gelden voor de pop-upknop, waarmee het contactformulier wordt geopend wanneer op de knop wordt geklikt.
- Knopgrootte – Selecteer de grootte van de knop. U kunt kiezen uit opties als klein, gemiddeld of groot.
- Ruimte boven knop – Pas de verticale afstand boven de knop aan (in percentage).
- Knopstijl – Kies de stijl van de knop, bijvoorbeeld standaard of aangepast.
- Knop kleur - Selecteer de kleurstijl voor de knop. De opties zijn Standaard, Omkeren of Aangepast.
- Knoptekst – Pas de tekstkleur voor de knop aan.
- Knopachtergrond – Selecteer de achtergrondkleur voor de knop.
Formulierknop
Met deze instellingen kunt u de knop voor het indienen van formulieren aanpassen aan het ontwerp en de lay-out van de pagina.
- Knopgrootte – Selecteer de grootte van de knop (Klein, Gemiddeld of Groot).
- Ruimte boven knop – Pas de verticale afstand boven de knop aan (aangegeven in percentage).
- Knopstijl – Kies de algemene stijl van de knop, bijvoorbeeld Standaard of Aangepast.
- Knop kleur - Stel de kleurstijl van de knop in. Opties zijn onder andere Standaard, Omkeren of Aangepast.
- Knoptekst – Pas de tekstkleur aan die op de knop wordt weergegeven.
- Knopachtergrond – Selecteer een achtergrondkleur voor de knop.
- Knopuitlijning – Kies de uitlijning van de knop (links, midden of rechts).
- Knopbreedte – Pas aan hoe breed de knop wordt weergegeven. Opties zijn onder andere Standaard, Groot, Extra Groot of Volledige Breedte.
Koptekstknoppen
Met deze instellingen bepaalt u hoe de knoppen er uitzien en waar ze zich bevinden, naast de kop van de sectie.
- Knopgrootte – Selecteer de algehele grootte van de knoppen (Klein, Gemiddeld of Groot).
- Ruimte tussen knoppen – Pas de afstand tussen meerdere knoppen aan (gemeten in vw).
- Ruimte boven knoppen – Stel de verticale afstand boven de knoppen in (gemeten in percentage).
- Knopbreedte – Kies hoe breed de knoppen moeten worden weergegeven. Opties zijn onder andere Standaard, Groot, Extra Groot en Volledige Breedte.
- Tekstlinkgrootte – Geef de lettergrootte op van tekstkoppelingen die aan knoppen zijn gekoppeld (gemeten in px).
- Afbeeldingsknopgrootte – Pas de grootte van op afbeeldingen gebaseerde knoppen aan (gemeten in px).
Koptekst sociale pictogrammen
Geef pictogrammen voor sociaal delen weer in het formulier en pas deze aan.
- Icoongrootte – Pas de grootte van de sociale pictogrammen aan (gemeten in px).
- Icoontype – Kies de stijl van de pictogrammen, bijvoorbeeld Klassiek, Effen of Omtrek.
- Icoonkleur – Selecteer de kleur voor de pictogrammen. Opties zijn onder andere Linktekst, Aangepast of Merkkleur (de originele kleur van het sociale platform).
- Achtergrondkleur van het pictogram – Stel een aangepaste achtergrondkleur in voor de pictogrammen om de zichtbaarheid en stijl te verbeteren.
Contactformulierinstellingen
- Klik op de Bewerk inhoud (1) knop.
- De formulierinstellingen aanpassen via settings (2) tabblad en Opslaan (3) uw wijzigingen.
Formulier naam
- Voer een naam in om Identificeer het contactformulier in Pixpa Studio. Deze naam is niet zichtbaar voor websitebezoekers.
Post indieningsactie
Als actie na indiening kunt u ervoor kiezen om dit te doen Toon succesbericht (1) of Omleiden naar URL (2).
In het geval van Toon succesbericht (1):
- Geef het Succesbericht (2) Dit wordt weergegeven nadat de gebruiker het formulier heeft verzonden.
- U kunt ook elk willekeurig script in het succes na betaling HTML (3) doos.
- In het geval van Redirect naar URLJe kunt elke interne/externe pagina specificeren door op het instellingenpictogram (⚙️) te klikken. Meer weten.
Formulier omleiden naar een andere pagina
Het omleiden van gebruikers naar een specifieke pagina nadat ze een formulier hebben ingediend, kan de algehele gebruikerservaring verbeteren en heeft verschillende doelen, zoals het vermijden van dubbele inzendingen, analyse en tracking, het vasthouden van gebruikers op de website voor een langere periode, enz.
Omleiding kan eenvoudig worden gemaakt met behulp van de Post indieningsactie optie op het tabblad Instellingen.
- U kunt een omleiding binnen uw website maken vanaf Website Content (1) optie. Het kan een pagina, galerij, blog, e-commerce galerij, map, enz. zijn. U moet de naam van het element in het veld invoeren zoals weergegeven in de onderstaande schermafbeelding en u krijgt suggesties die ermee verband houden.
- Gebruik External Link (2) optie om omleiding buiten uw website te creëren. U moet de URL invoeren in het veld waarnaar u wilt dat de gebruikers worden omgeleid na het indienen van het formulier.
Meer informatie over hoe u Linkbuilder gebruikt.
Formuliergegevens synchroniseren en exporteren
- Verzend formuliergegevens naar Make.com. Leer het team kennen.
- Verzend formuliergegevens naar Zapier.com. Leer het team kennen.
- Exporteer de formuliergegevens als een CSV-bestand. Leer het team kennen.
E-mailberichten
Vanaf hier kunt u het e-mailonderwerp aanpassen voor de meldingen die u als website-eigenaar ontvangt na een succesvolle indiening van een formulier. Daarnaast kunt u de succes-e-mail personaliseren die naar gebruikers of klanten wordt verzonden nadat ze het formulier hebben ingediend. Deze functie kan worden gebruikt voor branding, marketing en het effectief uitvoeren van campagnes.
- E-mail aan website-eigenaar: Schakel e-mailmeldingen voor formulierinzendingen in of uit. Indien ingeschakeld, worden meldingen verzonden naar de opgegeven e-mailadressen.
- Onderwerp: Pas de onderwerpregel van de e-mail aan. Gebruik de {WEBSITE} Variabele om de websitenaam dynamisch in het onderwerp op te nemen. Dit is handig wanneer u meerdere websites heeft.
- E-mail: Geef maximaal 3 e-mailadressen op die u een melding wilt sturen wanneer het formulier wordt verzonden.
- Geef het Onderwerp van de e-mail met het contactformulier. U kunt ook {WEBSITE} variabele om de naam van de website op te nemen.
E-mail naar klant
- U kunt inschakelen E-mail naar klant (1) om een e-mail te sturen over het succes van het indienen van het formulier.
- Geef het Onderwerp (2) van de post.
- Specificeer de inhoud in de e-mail van Succesbericht (3).
- E-mail naar de klant is een premiumfunctie die alleen beschikbaar is op Professioneel en Geavanceerd plannen. Leer het team kennen.
- Pas de e-mailinhoud zorgvuldig aan om een consistente en professionele communicatie-ervaring met uw klanten te garanderen.
Ingediende formuliergegevens
Ingezonden formuliergegevens in een contactformulier omvatten de informatie die een gebruiker in de formuliervelden invoert wanneer hij deze indient.
- Alle formuliergegevens worden opgeslagen en zijn toegankelijk via het Formulierinzendingen pagina van de studio. Leer het team kennen.
- Alle verzonden gegevens via het contactformulier worden ook doorgestuurd naar het e-mailadres dat is opgegeven in de contactformulierinstellingen. Jouw e-mailadres van het account wordt als standaard genomen.
Controleer ook: E-mailadres van account wijzigen.
Live voorbeeld
Hier is een live pop-up contactformulier:
Hier is een live inline contactformulier:
Om spammers op het formulier te verminderen, is de Google captcha-beveiliging automatisch ingeschakeld op uw formulier.