Contactformulier

Met de sectie Contactformulier voeg je eenvoudig een werkend mailformulier toe aan je pagina. Berichten die bezoekers via dit formulier versturen, worden automatisch doorgezet naar het e-mailadres dat je als 'Zender e-mailadres' hebt ingesteld in de algemene Shopify instellingen (onder 'Instellingen' > 'Meldingen').

Wanneer je deze sectie toevoegt via de preset Contact form, laadt het thema direct een kant-en-klaar formulier in met de meest gangbare velden (Naam, E-mail, Telefoonnummer, Bericht en een Verzendknop). Je kunt deze velden uiteraard naar wens aanpassen.

Algemene Layout & Vormgeving

• Kleurenschema's: Je kunt de kleuren van het contactgedeelte in twee lagen beheren:
  • Algemeen kleurenschema: Bepaalt de achtergrondkleur van de hele sectie.
  • Kleurenschema Kaarten (Cards): Bepaalt de achtergrondkleur van het kader (de 'kaart') waarin het daadwerkelijke formulier staat. Door hier een contrasterende kleur te kiezen, springt het formulier er mooi uit.
• Sectie weergave (Type): Bepaal of de achtergrond van deze sectie over de volledige breedte loopt (Edge-to-edge) of gecentreerd in een kader wordt getoond (Box).
• Afstanden (Witruimte): Beheer de marge (buitenruimte) en padding (binnenruimte) aan de boven- en onderkant. Kies tussen de standaard instellingen of verwijder de ruimte volledig.
• Aangepaste klasse (Custom Class): Een optie voor ontwikkelaars om eigen CSS toe te passen op het formulier.

Introductie & Tekst

Geef bezoekers wat context voordat ze het formulier invullen:

• Uitlijning: Lijn de titel en de inleidende tekst links, gecentreerd of rechts uit.
• Titel & Opmaak: Vul een pakkende kop in (bijv. "Neem contact op" of "Stel je vraag") en pas de HTML-tag, de visuele grootte en de letterdikte aan.
• Introductietekst (Intro text): Gebruik de teksteditor om een korte toelichting of bijvoorbeeld openingstijden en een telefoonnummer toe te voegen, direct boven het formulier.

Formuliervelden (Blokken)

Het daadwerkelijke formulier bouw je volledig modulair op met behulp van blokken. Je kunt de volgorde bepalen door ze te slepen. Elk blok vertegenwoordigt een onderdeel of invulveld:

• Koptekst (Header): Voeg een extra titel toe binnen in het formulierkader (bijv. "Vul je gegevens in").
• Naamveld (Input name): Het standaardveld voor de naam van de bezoeker. Je kunt aanvinken of dit veld verplicht (Required) is om in te vullen. (Maximaal 1 toe te voegen).
• E-mailveld (Input email): Het standaard, verplichte e-mailveld, zodat je op het bericht kunt reageren. (Maximaal 1 toe te voegen).
• Extra invulveld (Input field): Voeg zelf extra velden toe voor specifieke informatie (bijv. "Bestelnummer" of "Bedrijfsnaam").
  • Naam (Name): Dit is de interne systeemnaam van het veld. Gebruik hier geen spaties of speciale tekens (bijv. bestelnummer).
  • Label & Placeholder: Dit is de tekst die de bezoeker ziet. Het label staat boven het veld, de placeholder staat in het lege veld ter verduidelijking.
  • Type: Bepaal of de bezoeker tekst, een e-mailadres, een telefoonnummer (tel) of uitsluitend nummers mag invullen.
  • Verplicht (Required): Vink aan of de bezoeker dit veld móét invullen.
• Berichtveld (Textarea message): Het grote tekstvak waarin bezoekers hun vraag kunnen typen. Bepaal of dit verplicht is en stel het aantal weergegeven tekstregels in (Rows) om de hoogte van het vak te bepalen.
• Verzendknop (Button submit): De knop waarmee het formulier daadwerkelijk wordt verstuurd. Pas de tekst aan (bijv. "Verstuur bericht") en voeg optioneel een FontAwesome-icoontje (zoals een pijltje) toe. (Maximaal 1 toe te voegen).