Buildlyform

Helpcentrum

Uw offerteformulier op uw website

Kopieer de code in uw Buildlyform-dashboard (Formulieren → uw formulier → Embed op je website). Die laadt ons script en toont uw formulier: op de telefoon tikt de bezoeker op een knop voor een schermvullend formulier; op grotere schermen staat het formulier in de pagina zelf.

Voordat u begint

  • U heeft twee onderdelen nodig: de div met data-buildlyform-id en de <script>-tag. Plak ze samen.
  • Wijzig in de snippet alleen wat het dashboard aanbiedt (knoplabel, achtergrondkleur, optioneel tekstkleur, hoogte). De waarde in data-buildlyform-id is een openbare, willekeurige id (niet uw e-mailadres of gebruikersnaam)—gebruik de snippet zoals het dashboard die genereert. Embed-styling wijzigt het thema van het publieke formulier niet.
  • Het publieke formulier draait op form.buildlyform.com (of uw eigen formuliere-domein). Het embed-script bepaalt automatisch de juiste URL.

Hoe de embed werkt

  • Telefoon en smalle schermen (ongeveer < 768 px breed): bezoekers zien een knop. Bij tikken opent uw formulier in een laag over het hele scherm, met een sluitknop—vergelijkbaar met embeds zoals Typeform. Standaard volgt de knop de accentkleur van uw formulier; optioneel zet u op de div data-buildlyform-button-color en data-buildlyform-button-text-color voor alleen deze embed.
  • Desktop en brede schermen: het formulier staat in de pagina in een iframe. De hoogte die u in het dashboard instelt, geldt hier; het iframe kan meegroeien met de inhoud.
  • Optioneel: zet data-buildlyform-widget="true" op de div voor een zwevende knop op alle schermformaten (zie documentatie of ondersteuning als u dit gebruikt).

WordPress

  1. Open de pagina of het bericht waar het formulier moet komen.
  2. Voeg een blok Aangepaste HTML toe (of “HTML” / “Code” in de blokkiezer). Gebruik geen gewone tekstparagraaf voor scripts.
  3. Plak de volledige snippet uit Buildlyform en kies Bijwerken / Publiceren.
  4. Verwijdert de editor de <script>-tag, gebruik dan een plugin die scripts toestaat, of laad het script via het thema (footer) en zet alleen de div in de pagina—vraag zo nodig uw webbouwer.

Wix

  1. Klik in de editor op Toevoegen → Insluiten → HTML-code (of vergelijkbare embed).
  2. Plak de volledige Buildlyform-snippet in het HTML-veld en bevestig.
  3. Maak het embed-vlak breed genoeg voor het desktop-iframe; de hoogte regelt de embed.

Squarespace

  1. Bewerk de pagina en voeg een Code-blok toe (of een embed dat ruwe HTML accepteert).
  2. Zet het blok op HTML en plak de snippet.
  3. Sla op—het script moet echt uitgevoerd worden, niet alleen als tekst zichtbaar zijn.

Webflow

  1. Voeg een Embed-element toe uit het componentenpaneel.
  2. Plak de volledige snippet (div + script) in het embed-venster.
  3. Publiceer de site en test op de live URL; de ontwerper-preview kan iets afwijken.

Shopify

  1. Voor een aparte pagina: Webwinkel → Pagina's → pagina toevoegen → gebruik HTML-/code-weergave als uw thema dat heeft, of een sectie Aangepaste Liquid met de snippet.
  2. Voor de startpagina of een sectie: thema bewerken, blok Aangepaste Liquid (Online Store 2.0) toevoegen en de snippet plakken (eventueel in een omhullende div).
  3. Shopify kan scripts in sommige contexten blokkeren—laadt het formulier niet, vraag dan Shopify of een specialist om het embed-domein toe te staan.

Elke site (statische HTML of andere CMS)

  1. Open uw paginasjabloon of HTML-bestand.
  2. Plak de snippet waar het formulier moet komen—vaak in <main> of een kolom met inhoud.
  3. De <script> mag direct na de div of vóór </body>; het moet één keer per pagina geladen worden.
  4. Gebruik het script één keer als u meerdere formulieren op dezelfde pagina heeft (één script, meerdere divs met verschillende id's).

URL van het script

In productie laadt de snippet het script van dezelfde host als uw publieke formulieren, bijv. https://form.buildlyform.com/embed.js. Op localhost kan het dashboard een andere URL tonen zodat u lokaal kunt testen.