@nurtureflow/site
v1.1.1
Published
Nurtureflow site-integratie voor Astro-klantsites: visual-edit bridge, analytics, lead-capture en scheduler-booking als herbruikbare componenten.
Downloads
419
Maintainers
justindekruifReadme
@nurtureflow/site
De integratie-laag tussen een Astro-klantsite en het Nurtureflow-platform, als herbruikbare
componenten. Vervangt de ~200 regels JavaScript die nu per site met de hand in BaseLayout.astro
worden geplakt.
Identiek-eerst: v1 reproduceert het bestaande gedrag exact — zelfde visual-edit-contract, zelfde lead-payload, zelfde booking-widget. Geen gedragswijziging t.o.v. de inline-snippets.
Installeren
npm install @nurtureflow/siteComponenten
NurtureflowBridge — visueel bewerken
De brug waarmee het CMS de site in een iframe kan bewerken. Inert voor normale bezoekers (alleen
actief bij ?nf-edit + handshake van een toegestane CMS-origin). Geen props.
Plaats één keer onderin elke layout, net vóór </body>:
---
import { NurtureflowBridge } from "@nurtureflow/site";
---
<!-- ... -->
<NurtureflowBridge />
</body>Per-document bewerken (data-nf-doc)
Sinds v1.1.0 kan een pagina aangeven welk content-document 'm voedt, zodat het CMS per pagina/sectie
het júíste bestand bewerkt. Zet data-nf-doc op een voorouder (meestal <body>):
<body data-nf-doc="homepage"> <!-- singleton: "<collection>" -->
<body data-nf-doc={`adLandings/${slug}`}> <!-- collectie-document: "<collection>/<doc>" -->Globale chrome (header/footer) mag een eigen data-nf-doc krijgen (bv. siteSettings); een veld erft
het document van zijn dichtstbijzijnde [data-nf-doc]-voorouder. Geen data-nf-doc → het CMS valt
terug op "site" — één-bestand-sites blijven dus ongewijzigd werken en hoeven niet te updaten.
NurtureflowAnalytics — first-party Umami
---
import { NurtureflowAnalytics } from "@nurtureflow/site";
---
<head>
<NurtureflowAnalytics websiteId="431cd890-5a84-4cbf-89d2-5c96623afcdd" />
</head>websiteId = de per-site Umami-website-UUID. Optioneel: src (standaard /stats.js).
NurtureflowLeadCapture — aanvragen naar de inbox
---
import { NurtureflowLeadCapture } from "@nurtureflow/site";
---
<NurtureflowLeadCapture slug="studio-tempel" />Annoteer elk aanvraagformulier met data-nf-lead="<label>" (het label wordt de herkomst in de
inbox). Optioneel: endpoint (standaard https://platform.nurtureflow.agency/api/public/leads/<slug>/submit).
De annotaties (
data-nf-lead, en dedata-nf-field-labels voor de visuele editor) blijven per-site handwerk — dat is inhoud, geen herbruikbare code.
NurtureflowBooking — scheduler-widget
---
import { NurtureflowBooking } from "@nurtureflow/site";
---
<NurtureflowBooking projectSlug="gen-i-us" />Props: projectSlug (verplicht), apiUrl (standaard het platform-scheduler-endpoint),
heading, intro, serviceSlug, enabled. Widget-JS en -CSS worden meegebundeld — er hoeft
niets naar public/ gekopieerd te worden.
Versiebeleid
- patch/minor = veilige verbeteringen, achterwaarts compatibel met het platform-contract.
- Sites pinnen hun versie en updaten bewust (
npm update) — geen automatische upgrades, zodat één release nooit alle sites tegelijk kan raken.
Migratie vanaf inline-snippets
Per site: vervang het inline visual-edit-<script>, de Umami-<script>, de LeadCapture.astro
en de Booking.astro/booking-widget.js door de bovenstaande imports. Verifieer met een live
editor-smoke-test (klik een veld, bewerk, sla op) vóór je naar de volgende site gaat.