Terug naar overzicht
Block Libraries
Herbruikbare componentbibliotheken per branche voor consistente websites.
Wat zijn Block Libraries?
Een Block Library is een verzameling herbruikbare componenten (blokken) die je groepeert per branche of stijl. Denk aan een bibliotheek voor tandartsen, restaurants, makelaars of salons.
Elke library bevat:
• Een set componenten (bijv. Hero, Menu, Openingstijden)
• Design tokens (kleuren, lettertypes, spacing)
• Een versienummer (semver: 1.0.0)
Een library aanmaken
Klik op "Nieuwe library" en vul in:
1. Naam – Een herkenbare naam (bijv. "Restaurant Pro")
2. Widget – De branche waarvoor de library bedoeld is (tandarts, restaurant, makelaar, salon, juridisch of generiek)
Na het aanmaken kun je componenten selecteren en design tokens instellen.
Componenten en design tokens
In de library-editor kun je:
• Componenten selecteren die bij de branche passen
• Design tokens instellen: primaire kleur, lettertype, spacing, border-radius
• Een voorbeeld bekijken van hoe de componenten eruitzien met jouw tokens
De tokens worden automatisch toegepast op alle componenten in de library.
Tips
- Kies tokens die passen bij de huisstijl van de branche. Je kunt ze per site nog overschrijven.
- Hoe meer componenten je toevoegt, hoe flexibeler de library is voor verschillende sites.
Versiebeheer en publiceren
Elke library heeft een versienummer (bijv. 1.0.0). Wanneer je wijzigingen publiceert, kies je het type update:
• Patch (1.0.1) – Kleine bugfixes of aanpassingen
• Minor (1.1.0) – Nieuwe componenten of features
• Major (2.0.0) – Breaking changes
Sites die de library gebruiken kunnen updaten naar de nieuwste versie.
Let op
- Een major update kan bestaande sites beïnvloeden. Test altijd op een conceptsite voordat je een major versie uitrolt.
Token-presets koppelen
Elke library kan gekoppeld worden aan een set design token-presets. Dit zijn vooraf gedefinieerde combinaties van kleuren, lettertypes en spacing die bij een branche passen.
Zo koppel je een token-preset:
1. Open de library-editor
2. Ga naar het tabblad "Design Tokens"
3. Kies een bestaande preset of maak een nieuwe aan
4. Sla op — de tokens worden automatisch toegepast op alle componenten
Token-presets zorgen ervoor dat alle sites die deze library gebruiken een consistente look hebben.
Tips
- Maak presets per branche: een tandarts-preset met rustige blauwtinten, een restaurant-preset met warme kleuren.
- Je kunt per site de tokens nog overschrijven als de klant een eigen huisstijl heeft.
Library toewijzen aan sites
Je kunt een library toewijzen aan één of meerdere sites. Hierdoor krijgen die sites toegang tot alle componenten en tokens uit de library.
Zo wijs je een library toe:
1. Ga naar de library-instellingen
2. Klik op "Sites toewijzen"
3. Selecteer de sites die deze library moeten gebruiken
4. Bevestig — de componenten zijn direct beschikbaar in de page builder van die sites
Een site kan maar één library tegelijk gebruiken. Bij het wisselen van library worden bestaande blokken niet verwijderd, maar de beschikbare componenten veranderen.
Tips
- Wijs een library toe bij het aanmaken van een site via een blueprint voor de snelste setup.
- Controleer na het wisselen van library of alle bestaande blokken nog correct renderen.
Let op
- Het wisselen van library op een bestaande site kan ertoe leiden dat sommige blokken niet meer beschikbaar zijn in de editor.