Blokkenoverzicht

Header

Logo, zes menu-items en altijd de knop “Inschrijven”. Blijft bovenaan staan bij scrollen (72px hoog, dunne lijn). Onder 1120px klapt het menu in achter een ronde menuknop; “Inschrijven” blijft dan zichtbaar naast de menuknop.

Bron: vast onderdeel, menu uit WordPress-menu “Hoofdmenu”

B · Mobiel, dicht

Inschrijven Menu

C · Mobiel, open

Inschrijven Sluit

De Binding Kampen Activiteiten Nieuws Agenda Contact

Vragen? info@debinding.nl

Footer

Logo, social media als tekstknoppen (geen losse iconen zonder naam), adres met routelink, twee menu's en de ANBI-vermelding. Op mobiel stapelen de kolommen.

Bron: vast onderdeel; adres en social links uit thema-instellingen, menu's uit WordPress

Nieuwsbriefband

Cyaan band met inkttekst (5,9:1) direct boven de footer. Labels staan boven de velden in plaats van placeholders. Los van een verzenddienst ontworpen: drie toestanden.

Bron: vast onderdeel; koppeling met nieuwsbriefdienst nog open

Home-hero

Brede foto met penseelrand; de payoff staat op wit onder de foto, nooit eroverheen. De uitgelichte actie is een oranje bol met inkttekst die over de fotorand valt. Op mobiel wordt de bol een afgeronde kaart die direct onder de foto staat. Een matige telefoonfoto werkt: de foto draagt alleen sfeer, geen tekst.

Bron: los blok

B · Mobiel

Uitgelicht · najaar 2026

BEAU’tje

Voor kinderen uit groep 6, 7 en 8. Houd de website in de gaten.

Meer informatie

C · Zonder uitgelichte actie

Zonder actie blijven de bollen als decoratie in de fotohoek; de tekstkolom vult de breedte.

Paginatitel

Links uitgelijnd met kruimelpad, optioneel label, titel, intro en knoppen. De oude groene band van 270px zonder inhoud vervalt: de titel vertelt nu meteen waar de pagina over gaat. Kleurvarianten grijs, groen en cyaan, altijd met inkttekst. Op mobiel wordt de foto een kleine bol in de hoek.

Bron: los blok; titel standaard de paginatitel

B · Zonder foto, groen, met intro

C · Compact, tekstpagina

D · Mobiel, met foto · E · Lange titel

Documentaire ‘75 jaar kampen’ te bekijken

2 januari 2025

Sectie

De container waar andere blokken in gaan. Regelt achtergrond, ruimte boven en onder (64 → 96px), penseelrand en decoratieve bollen. De penseelrand zit bovenaan in de kleur van de vorige sectie, zodat elke sectie op zichzelf werkt. Bollen staan alleen in de buitenrand, nooit achter tekst. Op een merkkleur of donker is alle tekst inkt of wit volgens de contrastregel.

Bron: losse blokken erin

Wit · zonder rand

Lichtgrijs · rand + bollen

Merkkleur oranje · rand

Donker · rand + bollen

Sectiekop

Optioneel label in kapitalen, titel in gewone schrijfwijze, golflijn, optionele intro en optionele link rechts (“Al het nieuws →”). Links uitgelijnd; gecentreerd alleen voor korte koppen zonder intro.

Bron: los blok

Vrijwilligers

Mee als leiding of kok?

A · Label, titel, golflijn en intro.

B · Titel met link rechts.

Met dank aan

Onze sponsors

C · Gecentreerd, op donker.

Tekst met beeld

Tekst naast een foto in bolvorm (met twee kleurbollen eromheen) of naast het beeldmerk. Beeld links of rechts, knop optioneel. De bolvorm maakt een scheve of matige foto vergeeflijk: alleen het midden telt. Op mobiel staat het beeld altijd onder de tekst.

Bron: los blok

Kaart en kaartgrid

Eén kaartvorm voor nieuws, agenda, activiteiten en locaties, in plaats van de pilvormige cyaan en oranje kaarten. Neutraal vlak met inkttekst; het soort inhoud zie je aan het gekleurde bolletje en het label. Agenda-items krijgen een oranje datumbol over de foto. Zonder foto komt er een bollencompositie in de kleur van het soort, zodat de kaart even hoog blijft en niet in elkaar valt. De hele kaart is klikbaar. Grid 2, 3 of 4 kolommen; op mobiel altijd één.

Bron: query (nieuws, agenda, activiteiten) of losse kaarten (locaties, wegwijzer)

B · Locatie, zonder foto, met labels

C · Wegwijzer (home)

D · Randgeval: lange titel

Nieuws · [datum]

[Testtitel] Een heel lange titel die laat zien wat er gebeurt als een redacteur veel te veel woorden in de kop van een bericht zet

Titel wordt na drie regels afgekapt; de volledige titel staat op de detailpagina.

Uitgelicht item

Eén nieuwsbericht of agenda-item groot, met foto en korte samenvatting. Bovenaan Nieuws en Agenda, of op een activiteitpagina. Standaard het nieuwste item; de redacteur kan ook een vast bericht kiezen. Op mobiel staat de foto boven de tekst.

Bron: query (nieuwste of gekozen item)

B · Nieuws, zonder foto

C · Mobiel

Nieuws · 23 juni 2026

Vertrek- en aankomsttijden Bindingkampen

Lees meer

Agendalijst

Komende agenda-items, automatisch op datum, verlopen items verdwijnen vanzelf. Twee weergaven: compacte lijst (standaard, werkt met één item net zo goed als met tien) en kaarten (blok 09). Optioneel filter op activiteit en een filterbalk voor bezoekers op de Agenda-pagina. Een lege agenda toont een vriendelijke melding met een nieuwsbrieflink in plaats van niets.

Bron: query op berichttype agenda-item

A · Lijst met filterbalk (Agenda-pagina)

B · Lege agenda

C · Gefilterd op activiteit, leeg

Nieuwsoverzicht

Alle berichten als kaartgrid (blok 09, 3 kolommen), negen per keer, met “Meer laden” en een teller. Werkt zonder JavaScript als gewone paginering. Het nieuwsbriefarchief krijgt een eigen rustige strook in plaats van een rij links in de lopende tekst.

Bron: query op berichten; nieuwsbriefarchief als lijst

• December 2025
• December 2024
• September 2024
• April 2024
• September 2023

Infotegels

Kerngegevens als label, grote waarde en toelichting. Twee tot vier tegels; ze vullen de rij altijd volledig. De kleur van het hoekbolletje gaat vanzelf rond (oranje, cyaan, groen, donker). Op lichtgrijs worden de tegels wit.

Bron: lijst (label, waarde, toelichting)

Kampentabel

Echte tabel op desktop (kop met dikke lijn, kampnaam vet met kampletter eronder, prijs rechts). Onder 900px wordt elke rij een kaart met de prijs naast de naam. Het bolletje koppelt het kamp aan de kleur van de locatiekaart.

Bron: lijst (kamp, kampletter, voor wie, wanneer, soort, prijs, locatie)

A · Desktop

B · Mobiel, als kaarten

• Epe 1 · kamp A€ 350

  Voor wie

  11 jaar (groep 7)

  Wanneer

  ma 12 t/m za 17 juli 2027

  Soort

  tenten, wandelen

• Warnsveld 2 · kamp F€ 440

  Voor wie

  16 en 17 jaar (4e en 5e klas)

  Wanneer

  za 17 t/m za 24 juli 2027

  Soort

  huis, fietsen mee

Stappen

Genummerde stappen in gekleurde bollen. Naast elkaar bij drie of minder stappen, onder elkaar met een verbindingslijn bij vier of meer, en altijd onder elkaar op mobiel. Een echte geordende lijst, dus schermlezers lezen “stap 1 van 3”.

Bron: losse blokken (titel + tekst per stap)

A · Naast elkaar

1. 1VoorinschrijvingWas je vorig jaar mee? Dan heb je voorrang.
2. 2Open inschrijvingDaarna voor iedereen open.
3. 3AanbetalingDe helft via iDEAL, de rest vóór 1 april.

B · Onder elkaar (mobiel of 4+ stappen)

1. 1VoorinschrijvingWas je vorig jaar mee op kamp? Dan heb je een mail gekregen met een link.
2. 2Open inschrijvingDaarna gaan de inschrijfformulieren voor iedereen open.
3. 3AanbetalingBij de inschrijving betaal je via iDEAL de helft van de kampprijs.

Kolommen met icoon

Twee tot vier kolommen met icoon, titel en tekst. Iconen komen uit één lijnset (bijvoorbeeld Phosphor of Lucide, 32px, 2px lijn) en worden zelf gehost; zonder icoon valt het terug op een gekleurde bol. Op oranje: inkttekst, ook voor links. Dit lost het contrastprobleem van de huidige Visie/Missie/ANBI-band op.

Bron: lijst (icoon, titel, tekst)

Anno 2025

Een lokale stichting met deze visie en missie

Leiding

Als leiding ga je met een team een week mee met één leeftijdsgroep.

Kok

De koks zorgen een week lang voor het eten van de hele groep.

Veelgestelde vragen

Uitklapbaar met de standaard HTML-elementen details en summary: werkt zonder JavaScript en met het toetsenbord. Meerdere groepen per pagina, elk met een eigen tussenkop. Klik hieronder om te proberen.

Bron: losse blokken (vraag + antwoord, antwoord mag opmaak bevatten)

Kosten en inschrijven

Op kamp

Ankernavigatie

Geen zijbalk meer: een balk die onder de header blijft staan, op elk scherm. Daardoor houden de secties de volle breedte (beter ritme, grotere letter) en heeft een ouder op de telefoon de inhoudsopgave altijd bij de duim. Op mobiel horizontaal te scrollen. De sectie in beeld wordt donker gemarkeerd.

Bron: automatisch uit de H2-koppen, of handmatige lijst met korte labels

Activiteitgegevens

Datum, tijd, locatie, leeftijd en kosten als definitielijst, in inkt in plaats van cyaan. Lege velden verdwijnen, de rest schuift op. Op het agenda-item staat het blok naast de tekst, met het inschrijfblok (21) er direct onder: zo is “de knop op deze pagina” er ook echt.

Bron: velden van het agenda-item, of los ingevuld op een activiteitpagina

A · Paneel (agenda-item)

B · Strook (activiteitpagina), zonder tijd en locatie

Voor wie

Groep 6, 7 en 8

Wanneer

Woensdagen in het najaar

Kosten

Gratis

“Woensdagen in het najaar” is voorbeeldtekst; het veld is vrije tekst voor terugkerende activiteiten.

Oproep (CTA)

Titel, tekst en één of twee knoppen. Drie kleuren: donker (wit), oranje (inkt) en lichtgrijs (inkt). Bollen staan in de hoek, weg van de tekst. Op een volle breedte-sectie of als losse kaart.

Bron: los blok

A · Donker, één knop

Mee als leiding of kok?

Zonder vrijwilligers is er geen Bindingkamp. We zoeken elk jaar nieuwe mensen die een week willen meegaan.

B · Oranje, twee knoppen

Steun De Binding

De Binding is een ANBI: giften aan de Binding zijn aftrekbaar.

C · Lichtgrijs, compact

Vragen over de kampen?

Mail naar kampen@debinding.nl.

Inschrijfblok

Het herkenbare doorverwijsblok naar Kampadmin: kader met dikke inktlijn, statuslabel, korte uitleg en de oranje primaire knop met ↗ (je verlaat de site). Toestand en tekst kiest de redacteur; elke toestand heeft eigen standaardtekst, zodat alleen de datum hoeft te worden ingevuld. Zonder knop komt er een link naar de nieuwsbrief.

Bron: los blok, toestand handmatig

Schrijf je in voor de Bindingkampen 2027

Inschrijven en betalen doe je in Kampadmin, ons inschrijfsysteem. Elke deelnemer schrijf je apart in.

De inschrijving opent op [datum]

Vanaf dan schrijf je in via Kampadmin. Meld je aan voor de nieuwsbrief, dan krijg je bericht.

Bergeijk (kamp D) is vol

Je kunt je nog aanmelden voor de wachtlijst. Komt er een plek vrij, dan hoor je het van ons.

De inschrijving is gesloten

Inschrijven voor dit jaar kan niet meer. [Wanneer opent de volgende inschrijving?]

Sponsors

Compacte strook met kop links en logo's in vaste vakjes (180 × 96). Logo's in eigen kleur, gecentreerd. Met één logo is het een nette rij in plaats van één logo op een groot wit vlak; met veel logo's loopt de rij door op een nieuwe regel.

Bron: lijst (logo, naam, link)

Met dank aan

Onze sponsors

Met dank aan

Onze sponsors

Contactgegevens

Adres met routelink, algemeen e-mailadres en de Bindingwerker met naam en telefoon. Telefoon en e-mail zijn tikbare links. Optioneel een tweede e-mailadres per onderwerp (kampen@).

Bron: los blok; standaard gevuld uit thema-instellingen

Adres

E-mail

Bindingwerker

Contactformulier

Vormgeving voor WPForms: label boven het veld, 52px hoog, 2px rand, verplichte velden gemarkeerd. Fouten per veld onder het veld plus een samenvatting bovenaan na verzenden. De bevestiging vervangt het formulier en zegt wanneer je antwoord kunt verwachten.

Bron: WPForms, vormgeving via thema-CSS

A · Met foutmeldingen

B · Bevestiging

Instagram-feed

Vier of acht vierkante berichten in een raster, met de knop naar het account altijd in de kop. Laadt de plugin niet of is de feed leeg, dan verschijnt een korte melding met dezelfde knop: er staat nooit meer een lege sectie met alleen een titel.

Bron: plugin (bijv. Smash Balloon), terugval in het blok zelf

A · Feed werkt

B · Feed laadt niet of is leeg