6. Site-instellingen en huisstijl
Sommige dingen gelden voor je hele website: je logo, je kleuren, je lettertype, je header en footer. Die stel je één keer in — niet per pagina.
Klik in de editor op Site-instellingen. Het venster heeft vier tabbladen. Alles wordt automatisch opgeslagen; onderin staat ✓ Automatisch opgeslagen.
Tab 1 — Instellingen
Naam van de website. Verschijnt in het browsertabblad en in zoekresultaten.
Omschrijving voor zoekmachines. Eén of twee zinnen die onder je naam in Google verschijnen. Schrijf hier wat je doet en waar, bijvoorbeeld: "Ambachtelijke bakkerij in Utrecht — vers brood en gebak, elke dag." Doen: het is de goedkoopste manier om vindbaarder te worden.
Contactgegevens. Bedrijfsnaam, e-mailadres, telefoonnummer en adres. Deze worden automatisch in je footer getoond — je hoeft ze dus maar op één plek bij te houden.
Tab 2 — Branding
Logo. Je logo voor in de header. Witruimte om je logo wordt automatisch weggesneden, zodat het netjes uitlijnt.
Logo voor donkere achtergrond. Optioneel. Heb je een donkere header, dan is een lichte versie van je logo vaak beter leesbaar.
Favicon. Het kleine icoontje in het browsertabblad. Gebruik een vierkant beeldmerk, geen breed logo met tekst.
Merkkleuren. Je eigen kleuren, bijvoorbeeld twee of drie uit je logo. Ze verschijnen als snelkeuze in elke kleurkiezer op je site.
Waarom dit belangrijk is: kies je ergens een merkkleur, dan blijft dat blok eraan gekoppeld. Besluit je later dat je blauw net iets dieper moet, dan pas je één keer je merkkleur aan en verandert je hele site mee. Kies je in plaats daarvan losse kleuren, dan mag je ze allemaal met de hand langs.
Heb je een logo geüpload, dan halen we daar automatisch kleursuggesties uit.
Tab 3 — Styling
Achtergrondkleur van de website.
Kleuren header & footer — achtergrond van de balk bovenaan en onderaan.
Tekstkleuren — de kleur van gewone tekst en van titels. Je kunt alle titelniveaus dezelfde kleur geven, of per niveau (H1 t/m H4) verschillen.
Lettertype. Kies een lettertype-pakket: een combinatie van een kopletter en een tekstletter die goed samengaan. Je ziet van elk pakket een voorbeeld. Eén keuze, hele site netjes — dat is bewust zo.
Animaties. Zet subtiele scroll-animaties aan of uit: blokken die zachtjes in beeld komen als de bezoeker naar beneden scrolt.
Knopstijlen. Hier bepaal je hoe Primair en Secundair eruitzien: vulkleur, tekstkleur, rand en ronde hoeken. Je ziet meteen een voorbeeld.
Deze twee stijlen gelden voor alle knoppen op je site. Gebruik ze dus, en grijp alleen naar Aangepast als één knop echt moet afwijken. Koppel de kleuren aan je merkkleuren, dan bewegen je knoppen automatisch mee als je je huisstijl aanpast.
Tab 4 — Layout
Breedte van de site — Smal (960 px), Gemiddeld (1140 px) of Breed (1280 px). Dit is de maximale breedte van je inhoud op grote schermen. Smal leest rustiger, breed oogt moderner.
Witruimte header & footer — Klein, Normaal of Ruim.
Footer — vierde vak. Je footer heeft vier vakken. De eerste drie vullen zich met je logo, je menu en je contactgegevens. Het vierde kies je zelf:
- Social media-iconen — voeg per platform een link toe (Facebook, Instagram, LinkedIn, X, YouTube, WhatsApp, TikTok);
- Een stuk tekst — bijvoorbeeld een korte pay-off of openingstijden.
Standaard pagina-opbouw. Handige tijdbesparer: sta je op een pagina die precies de opbouw heeft die je vaker wilt, klik dan op Huidige pagina als standaard opslaan. Elke nieuwe pagina begint dan met die opbouw in plaats van leeg. Met Standaard wissen zet je het terug.
Het snelle merkkleuren-paneel
Naast de knop Site-instellingen staat een palet-icoontje 🎨. Dat opent een klein paneel waarin je alleen je merkkleuren aanpast — zonder het hele venster te openen. De kleuren passen zich direct aan.
Header en footer
Je header (met logo en menu) en footer worden automatisch opgebouwd. Je hoeft er geen blokken voor te slepen: ze staan op elke pagina, en je menu volgt vanzelf je pagina's.
De footer heeft vier vakken naast elkaar:
- je logo (of je sitenaam als je nog geen logo hebt);
- het menu met al je pagina's;
- je contactgegevens (uit tab Instellingen);
- het vak dat je zelf kiest: social-iconen of een stuk tekst.
Helemaal onderaan staat een smalle zwarte balk met je copyright en een verwijzing naar Webtooly. Koppel je een eigen domein aan een betaald abonnement, dan wordt die regel korter ("Powered by Webtooly.com").
Wat je eraan instelt, doe je hier bij de site-instellingen:
- het logo (tab Branding),
- de achtergrondkleuren en de witruimte (tabs Styling en Layout),
- de contactgegevens in de footer (tab Instellingen),
- het vierde footer-vak (tab Layout).
