Intro

Het introblok is een blok, ontwikkeld door Noeste IJver, voor een opvallende, goed gepositioneerde eerste sectie van een pagina.

1. Hoe voeg ik het blok toe? #

Klik op het + icoon in de hoofdnavigatie of in het content gebied. Typ ‘intro‘ en klik op het introblokicoon om het toe te voegen.

2. Blokwerkbalk #

De werkbalk van het introblok

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 zonder 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
Wijd
Volle breedte

#

2.4. Kies een richting/variatie #

Onder deze functie vind je een keuzemenu met verschillende varianten van het introblok. Kies een variant die het beste bij jouw content past:

Color: een simpele intro met gekleurde (met thema kleuren) achtergrond, koptekst, paragraaf en twee knoppen.
Color-image: een intro met links een card en rechts een afbeelding.
Hero: een intro met een afbeelding op de achtergrond en links een card met gekleurde achtergrond.
Home: een intro met links een card en rechts een afbeelding. Deze intro maakt geen gebruik van kolommen in tegenstelling tot de vorige drie variaties. Hierdoor is de uitlijning anders.
Cover image combination: hogere intro met links een card en rechts aan afbeelding. In tegenstelling tot de vorige cards zit er meer ruimte tussen de content en het containerblok.

Zie jij de volgende benaming nog? Neem dan contact op via de button

Intro 1.3
Intro pages 1.7
Intro homepage 1.0 && intro pages 3.0
Intro hompage 2.0 && intro pages 2.0

Neem contact op

2.5. 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. Geavanceerd #

Bloknaam

Pas hier de naam van het blok aan. De bloknaam 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 de achtergrondkleur. Na het klikken opent een submenu met twee tabbladen: ‘effen‘ en ‘kleurverloop‘.

Effen

Hier heb je de keuze voor de themakleuren (ingesteld door de ontwikelaar van Noeste IJver) en standaardkleuren.

Kleurverloop

Kies meerdere aangepaste kleuren door op een plek in het balkje te klikken om een kleur submenu te openen en een kleur te kiezen. Het kleurverloo pgaat over in de kleur die je op een bepaalde plek in de balk gekozen hebt. Je kunt kiezen voor een ‘Lineair kleurverloop‘ (van links naar rechts) of een ‘Radiaal kleurverloop‘ (vanuit het midden naar buiten).

Standaard en hover

Na het klikken op ‘Link’ opent een submenu met twee tabbladen:

Standaard: Staat voor de kleur van de link die altijd in beeld is.
Hover: Staat voor de kleur die verschijnt als je met je muis op de link gaat staan.

3.2.2. 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, VW of VH. Vind uitleg hierover in dit overzicht.