Site Logo

Het Site logo-blok is een blok met een logo afbeelding.

1. Hoe voeg ik het blok toe? #

Klik op het + icoon in de hoofdnavigatie of in het content gebied. Typ ‘Site logo‘ en klik op het Site logo-blokicoon om het toe te voegen.

2. Blokwerkbalk #

De werkbalk van het site logo-blok

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. Duotone #

Dit voegt een tweekleurige filter toe op de afbeelding. In het scherm dat opent staan elf cirkels met twee kleuren. Klik op één van de cirkels om die kleuren toe te passen.

Onder de elf cirkels staan de kleuren van de gekozen cirkel in een balk. De linker staat voor de schaduwen en de rechter voor de hoogtepunten (highlights).

Klik op één van de twee cirkels om de kleuren aan te passen of klik op de links ‘schaduwen’ en ‘Hoogtepunten’ eronder.

2.4. Verander uitlijning #

Verander hiermee de uitlijning naar:

Geen
Links
Midden
Rechts

2.5. Bijsnijden/ bewerken #

Deze functie maakt het mogelijk om een afbeelding te bewerken zonder de block editor te verlaten. klik hierop voor een keuzemenu:

Inzoomen: Gebruik het schuifbalkje of typ een getal tussen de 100 en 300 achter het schuifbalkje om in te zoomen. Zodra je tevreden bent met de zoom, klik dan op ‘Toepassen‘. Wil je de zoom verwijderen? Klik dan op ‘Annuleer‘
Verhouding aanpassen: Hiermee kan je de verhoudingen van de afbeelding aanpassen naar bijvoorbeeld een vierkante afbeelding.
Roteren: Hiermee kan je de afbeelding een kwartslag naar rechts draaien. Klik nogmaals om de afbeelding nog een kwartslag te draaien. Na vier keer klikken staat de afbeelding weer recht.

Let op: Het inzoomen gaat automatisch. Het is niet mogelijk om de focus naar links of rechts aan te passen.

Klik op ‘toepassen‘ om de wijzigingen door te voeren.

2.6. Toevoegen/ vervang #

Hiermee kan je de afbeelding toevoegen of vervangen. Klik hierop om de mediabibliotheek te openen of om een andere afbeelding te uploaden.

2.7. 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 ( Instellingen icoon in blokinstellingen tabblad. ) en stijlen ( Stijlen icoon )

3.1. Instellingen #

Pas hier de werking van het blok aan.

3.1.1. Media #

Hier kan je een andere afbeelding als logo instellen. Upload een afbeelding, kies een eerder geüploade afbeelding uit de mediabibliotheek of herstel de oorspronkelijke afbeelding.

3.1.2. Instellingen #

Hier vind je vier instellingen:

Stel de breedte van het logo in door de blauwe stip naar links of rechts te schuiven. Je kan ook een cijfer invoeren. Hoe hoger, hoe breder.
Het is doorgaans de gewoonte om een logo te laten functioneren als home-knop. De schakelaar ‘Link afbeelding naar home‘ staat standaard aan. Zet deze uit als je de link wil verwijderen.
Zet de schakelaar ‘Open in een nieuwe tab’ aan als je wil dat de link in een nieuw tabblad opent.
Zet de schakelaar ‘Gebruiken als site pictogram‘ aan om deze afbeelding te gebruiken als site pictogram. Dit is de kleine afbeelding die in de browser tabbladen voor de sitenaam staat.

3.1.3. 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. Stijlen #

Hier kan je met de klik op een knop een stijl aanbrengen. Ga met je muis op de knop staan om een voorbeeld te zien of klik op de knop om de stijl toe te passen.

3.2.2. Filters (duotoon) #

Voegt een tweekleurige filter toe op de afbeelding. In het scherm dat opent staan elf cirkels met twee kleuren. Klik op een van de cirkels om de filter over de afbeelding te plaatsen.

3.2.3. Afmetingen #

Pas hier de ruimte om het blok aan.

Klik op het + icoon achter ‘Afmetingen’ en maak een keuze.

Padding

De padding is de ruimte tussen de rand van het blok en de tekst.

Klik op dit icoon ( Keuzesymbool dimensies van blokinstellingen ) om te kiezen welke zijden je wilt aanpassen. Verschuif de blauwe stip om de padding groter of kleiner te maken.

Wil je het zelf instellen? Klik dan op dit icoon ( Schuifregelaar pictogram blokinstellingen ). Kies hier voor PX, EM, REM (Of %, VW of VH). Meer uitleg hierover vind je in dit overzicht.

Marges

De marge bepaalt de ruimte tussen de blokken.