Het zoeken-blok geeft een zoekbalk weer die de bezoeker kan gebruiken op op jouw site te zoeken.
1. Hoe voeg ik het blok toe? #
Klik vervolgens op het + icoon in de hoofdnavigatie of in het content gebied. Typ ‘Zoeken‘ en klik op het zoekenblokicoon om het toe te voegen.
2. Blokwerkbalk #

Selecteer het blok zodat de blokwerkbalk (erboven) weergegeven wordt. Hieronder leggen we uit wat elke functie in de blokwerkbalk doet.
2.1. Verander naar een ander type blok #
Standaard staat hier het (geselecteerde) blokicoon, dat per blok verschilt. Klik hierop om een ander blok te kiezen onder dit blok te verwijderen en weer op het + icoon te hoeven klikken. Kies een blok uit de lijst die na het klikken verschijnt.
2.2. Blok verplaatsen #
Het icoon met zes stipjes heeft een sleepfunctie. Klik op deze puntjes en houd ze vast om het blok te verplaatsen naar een nieuwe locatie. Naast de sleepfunctie staat een icoon met een pijltje omhoog en omlaag. Klik op één van de pijltjes om het blok een plekje omhoog of omlaag te schuiven.
2.3. Verander blokuitlijning #
Verander hiermee de uitlijning naar:
- Geen
- Links
- Midden
- Rechts
2.4. Toggle zoek label #
Klik op deze functie om het woord ‘Zoek‘ boven het invulveld weer te geven of te verbergen.
2.5. Wijzig de knoppositie #
Kies hier voor één van de vier ‘Zoek‘ knopmogelijkheden: plaatsing buiten of binnen het zoekveld en de opties: ‘Geen knop‘ en ‘Alleen knop‘.
2.6. Gebruik knop met pictogram #
Kies hier voor een vergrootglas pictogram of het woord ‘Zoek‘.
2.7. Vet en cursief #
Klik op één van deze iconen om de tekst te benadrukken met vetgedrukte of cursieve letters. Je kunt ook de volgende sneltoetsen gebruiken:
- Windows
- CRTL + B (Bold)
- CTRL + I (Cursief)
- Apple
- CMD + B (Bold)
- CMD + I (Cursief)
2.8. Meer opties #
Onder dit icoon vind je meer bewerkingsfuncties zoals:
- Dupliceren
- Verwijderen
- Invoegen voor
- Invoegen na
- Bewerken in HTML
Hiervoor hebben we een apart overzicht gemaakt op deze pagina. Zoek naar de functie die je wilt gebruiken.
3. Blokinstellingen #
De blokinstellingen zijn verdeeld in twee tabbladen: instellingen ( ) en stijlen (
)
3.1. Instellingen #
Pas hier de werking van het blok aan.
3.1.1. Weergave instellingen #
Hier kan je de breedte van de zoekbalk instellen. Er zijn drie opties:
- Pixels
- Percentages
- Voorgeprogrammeerde percentages.
Gebruik percentages voor responsief ontwerpen.
3.1.2. Geavanceerd #
Bloknaam
Pas hier de naam van het blok aan. Deze vind je terug in het ‘Document overzicht’.
Extra CSS-klasse
Gebruik dit invulveld om extra CSS-klassen toe te voegen.
3.2. Stijlen #
Pas hier de opmaak van het blok aan.
3.2.1. Kleur #
Kies de kleur van de tekst, link en/of achtergrondkleur (binnen het blok). Na het klikken opent een submenu met twee tabbladen.
Effen
Hier heb je de keuze voor de themakleuren (ingesteld door de ontwikkelaar van Noeste IJver) en standaardkleuren.
Kleurverloop
Kies meerdere aangepaste kleuren door op een plek in het balkje te klikken om een kleursubmenu te openen en een kleur te kiezen. Het kleurverloop gaat over in de kleur die je op een bepaalde plek in de balk gekozen hebt. Je kunt kiezen voor:
- Lineair: Standaard van links naar rechts
- Radiaal: Van het midden naar buiten
3.2.2. Typografie #
Hier vind je alle instellingen voor het bewerken van lettertypes.
Grootte
Dit is een standaard instelling die altijd zichtbaar is. Als je wilt dat de grootte van een (kop)tekst afwijkt van de standaard, dan kan je kiezen voor de volgende maten:
- S
- M
- L
- XL
- XXL
Wil je het zelf instellen? Klik dan op dit icoon ( ). Kies hier voor PX, EM, REM (Of %, VW of VH). Meer uitleg hierover vind je in dit overzicht.
Via het driepunten icoon achter het woord typografie kan je meerdere instellingen zichtbaar maken:
- Font familie: De stijl van de letters
- Weergave: De dikte van de letters binnen de font familie
- Lijnhoogte: hoe hoog de letters zijn
- Letterafstand: Hoe ver de letters van elkaar af staan
- Tekstversiering: Onderlijnen of doorhalen van de tekst
- Lettercase: De manier van hooflettergebruik
- HOOFDLETTERS
- kleine letters
- Met Hoofdletter
3.2.3. Rand #
Dit zijn de instellingen voor de rand:
- Kies voor een kleur of laat het op transparant staan.
- Voor in hoe breed je de rand wil weergeven of pas de breedte aan met de schuifregelaar ernaast. Je kant op ‘PX‘ klikken om te kiezen voor een andere eenheid. Bekijk de uitleg over de eenheden in dit artikel.
- Met dit icoon (
) staan alle kanten van de rand aan elkaar gekoppeld. Wil je niet alle randen even dik? Klik dan op dit icoon om de rand apart in te stellen.
Radius
De radius maakt de hoeken van de rand ronder. Gebruik pixels om de hoeken af te ronden. Gebruik het percentage om de rand elliptisch te maken. Meer uitleg over deze eenheden vind je hier.
Met dit icoon ( ) staan alle kanten van de rand aan elkaar gekoppeld. Wil je niet alle randen even dik? Klik dan op dit icoon om de rand apart in te stellen