Brand

Sykje

Demopagina

Dit is de introductie van een pagina en zal zichtbaar zijn in de header. Meestal onder de titel of boven / naast een header afbeelding.

Overzichten

Categorieën

Berichten

Nieuwsitems kunnen op verschillende manieren worden weergegeven.

Overzicht

  • Nieuws kan worden weergegeven per categorie (meerdere mogelijk)
  • Er kan een maximaal aantal berichten ingesteld worden. Door ‘Toon categorie-filter’ in te schakelen zal er een laad meer knop getoond worden.
  • Eventueel kan er ook nog een zoekfunctie ingeschakeld worden.
Soarch Kalender

Foarlêsferhalen

Kalender

21 febrewaris

Dei fan de memmetaal

Tekst

Paragraaf

Het paragraaf blok in de WordPress Gutenberg editor is een van de meest gebruikte blokken voor het toevoegen van tekst aan je pagina’s en berichten. Het stelt je in staat om eenvoudig tekst in te voeren, te bewerken en op te maken zonder dat je code hoeft te gebruiken. Het paragraaf blok is de basis voor het schrijven van inhoud in WordPress.

Opmaakopties:

  • Tekst uitlijnen: Kies links, rechts of gecentreerde uitlijning voor de tekst.
  • Vetgedrukt: Maak de geselecteerde tekst vet.
  • Cursief: Maak de geselecteerde tekst schuin.
  • Link: Voeg een hyperlink toe aan de tekst.

Koptekst

Het koptekst blok in de WordPress Gutenberg editor is een belangrijk blok dat wordt gebruikt om koppen of titels in je content te creëren. Het helpt je om de inhoud op je pagina of bericht op te delen in logische secties, wat de leesbaarheid verbetert en de hiërarchie van de tekst aangeeft. Kopteksten worden ook vaak gebruikt voor SEO-doeleinden, omdat zoekmachines zoals Google deze gebruiken om de structuur van je pagina beter te begrijpen.

Kopniveau kiezen (H1, H2, H3, etc.):

  • H1: Dit is het hoogste kopniveau en wordt doorgaans gebruikt voor de hoofdtitel van een pagina. Deze wordt over het algemeen via de code al uitgelezen en hoeft niet in de editor geplaatst te worden.
  • H2: Dit is een subkop en wordt vaak gebruikt voor secties onder de hoofdtitel.
  • H3: Nog een niveau lager, vaak gebruikt voor subsecties binnen een H2-sectie, enzovoorts tot H6.

Dit is een H1

Dit is een H2

Dit is een H3

Dit is een H4

Dit is een H5
Dit is een H6

Lijst

Het lijst blok in de WordPress Gutenberg editor is een eenvoudig maar krachtig hulpmiddel waarmee je lijsten met items kunt maken, zowel genummerde (geordende) als opsommingstekens (ongeordende) lijsten. Dit blok is handig voor het opsommen van punten, stappen of elke reeks items die gestructureerd gepresenteerd moeten worden.

In de toolbar van het lijst blok kun je kiezen tussen twee soorten lijsten:

Ongeordende lijst:

  • Lijst optie 1
  • Lijst optie 2
  • Lijst optie 3

Geordende lijst:

  1. Lijst optie 1
  2. Lijst optie 2
  3. Lijst optie 2

Citaat / Quote

Het quote blok in de editor stelt je in staat om citaten op een opvallende en gestileerde manier toe te voegen aan je berichten of pagina’s. Citaten worden vaak gebruikt om belangrijke uitspraken of teksten te benadrukken. Het quote blok biedt standaardopmaak om de citaten visueel aantrekkelijk te maken, en je kunt de stijl en indeling van het citaat aanpassen.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eleifend eros augue, eu posuere leo aliquam id. 

Citaat bron

Tabel

Het tabel blok maakt het gemakkelijk om tabellen toe te voegen aan je pagina’s en berichten. Een tabel is handig voor het overzichtelijk weergeven van gegevens in rijen en kolommen, zoals prijzen, vergelijkingen, specificaties of elke andere vorm van gestructureerde informatie.

  • Standaardstijl: Een eenvoudige, basisstijl voor de tabel.
  • Gestreepte rijen: Dit maakt de rijen in de tabel afwisselend gekleurd, wat het visueel aantrekkelijker en gemakkelijker te lezen maakt.
Tabel headTabel headTabel head
Tabel met meer inhoud.Tabel inhoudTabel inhoud
Tabel inhoudTabel inhoudTabel met meer inhoud.
Tabel inhoudTabel met meer inhoud.Tabel inhoud
Tabel footTabel footTabel foot
Onderschrift tabel
Tabel headTabel headTabel head
Tabel inhoudTabel inhoudTabel inhoud
Tabel inhoudTabel inhoudTabel inhoud
Tabel inhoudTabel inhoudTabel inhoud
Tabel footTabel footTabel foot
Onderschrift gestreepte tabel

Accordion / expander

En dit is dan de inhoud van het blok.

En dit is dan de inhoud van het blok. 2

Media

Afbeelding

Het afbeeldingen blok is een van de meest gebruikte blokken, omdat het je in staat stelt om gemakkelijk afbeeldingen toe te voegen en te beheren in je pagina’s of berichten. Je kunt afbeeldingen uploaden, selecteren uit je mediabibliotheek, of via een URL invoegen. Dit blok biedt verschillende opties voor uitlijning, bijschriften en opmaak, zodat je afbeeldingen op een aantrekkelijke manier kunt presenteren.

Foto:

Galerij

Het galerij blok maakt het eenvoudig om een groep van meerdere afbeeldingen op een visueel aantrekkelijke manier weer te geven. Dit blok is perfect om bijvoorbeeld een fotogalerij, portfolio, of verzameling productafbeeldingen te maken. Met het galerij blok kun je afbeeldingen uploaden, uit de mediabibliotheek kiezen, de lay-out aanpassen, en de weergave van de galerij volledig beheren.

Audio

Het audio blok maakt het mogelijk om audiobestanden toe te voegen aan je pagina’s of berichten. Dit blok is ideaal voor het delen van podcasts, muziek, gesproken woord of andere audio content. Het audio blok biedt een ingebouwde audiospeler waarmee bezoekers direct op je website naar de audio kunnen luisteren.

Bestand

Het bestand blok is een handige manier om bestanden, zoals PDF’s, Word-documenten, Excel-spreadsheets, of andere downloadbare bestanden, beschikbaar te stellen op je website. Dit blok biedt een eenvoudige interface om bestanden te uploaden en aan bezoekers aan te bieden, met een ingebouwde download knop. De tekst van de knop kan aangepast worden en met de extra opties die in de rechterbalk verschijnen kan worden ingesteld of de link in het eigen of een extern venster geopend wordt.

Video

Het video blok maakt het gemakkelijk om video’s toe te voegen aan je pagina’s of berichten. Dit blok biedt je de mogelijkheid om video’s te uploaden vanaf je computer, of video’s in te voegen die gehost worden op platforms zoals YouTube, Vimeo, of andere videodiensten.

Nadat de video is toegevoegd, verschijnt er een ingebouwde videoplayer op de pagina. Hiermee kunnen bezoekers de video afspelen, pauzeren, en door de video heen spoelen.

De video wordt weergegeven op je website in een standaard HTML5 videoplayer, waardoor het bestand compatibel is met verschillende apparaten en browsers.

In de rechterzijbalk van de editor kun je verschillende instellingen aanpassen voor het video blok:

  • Autoplay: Hiermee kun je instellen dat de video automatisch begint te spelen wanneer de pagina wordt geladen. Houd er echter rekening mee dat autoplay door sommige browsers kan worden geblokkeerd of beperkt.
  • Loop (herhalen): Wanneer deze optie is ingeschakeld, wordt de video automatisch opnieuw afgespeeld zodra deze is afgelopen.
  • Mute (dempen): Deze optie dempt het geluid van de video wanneer deze automatisch afspeelt of wordt geladen.
  • Vooruit- en achteruitspoelen toestaan: Dit geeft gebruikers de mogelijkheid om door de video te spoelen, zowel vooruit als achteruit.
  • In de zijbalkopties kun je een posterafbeelding instellen. Dit is een afbeelding die wordt weergegeven voordat de video begint af te spelen, wat handig is als je een specifieke thumbnail wilt tonen die de inhoud van de video weergeeft.

Klik in de editor op de onderstaande video om de voorkeurs instellingen te bekijken.

Video binnen een container over de volledige breedte

Video binnen een gekaderde container

Video binnen een gekaderde container met witruimte

Afbeeldingen carrousel

Een afbeeldingen carrousel blok in WordPress stelt je in staat om een reeks afbeeldingen in een roterend formaat te tonen, waarbij gebruikers door de afbeeldingen kunnen scrollen. Dit type blok is handig voor het tonen van meerdere foto’s, portfolio’s, of productafbeeldingen op een overzichtelijke en visueel aantrekkelijke manier.

Je kunt kiezen uit afbeeldingen die al zijn geüpload naar de mediabibliotheek, of je kunt nieuwe afbeeldingen uploaden vanaf je computer. Nadat je de afbeeldingen hebt geselecteerd, kun je ze eenvoudig in de gewenste volgorde slepen.

Ontwerp

Knoppen

Het Knoppen‐blok geeft je alle vrijheid om één of meerdere knoppen op je pagina precies zo te plaatsen en te stylen als je wilt. Zo kun je eenvoudig knoppen maken die perfect aansluiten op de lay-out en sfeer van je website, én gebruikers op een heldere manier doorverwijzen naar de gewenste content. Hieronder vind je een overzicht van alle mogelijkheden:

  1. Richting
    Je kunt bepalen of je knoppen naast elkaar komen te staan of onder elkaar:
    • Horizontaal: knoppen worden in één rij naast elkaar uitgelijnd.
    • Verticaal: knoppen stapelen van boven naar onder in één kolom.
  2. Uitlijning
    Per rij of kolom kies je hoe de knoppen binnen hun container komen te staan:
    • Links: alle knoppen worden tegen de linkerkant van de container geplaatst.
    • Midden: knoppen centreren automatisch.
    • Rechts: knoppen schuiven naar de rechterkant.
  3. Link-instellingen
    Elke knop kan een eigen bestemming en gedrag meekrijgen:
    • Zoek een pagina of bericht – Koppel de knop direct aan een bestaande pagina of blogpost door te zoeken in je content.
    • Handmatige URL – Plak een link naar externe pagina’s of bestanden in het URL-veld en geef desgewenst een custom knoptekst op.
    • Open in nieuw tabblad – Activeer deze optie om de link in een nieuw browser­venster/tab te laten openen. Handig bij downloads of externe verwijzingen.
  4. Weergave
    • Stijl van de knop – Elke kleurvariant is afgestemd op je huisstijl of contrasteert juist voor extra nadruk. Kies uit verschillende kleur­thema’s en afwerkingen:
      • Volle achtergrond (vol)
      • Omlijnd (lijn)
    • Grootte van de knop – Bepaal de zichtbaarheid en hiërarchie met drie formaten:
      • Klein
      • Gemiddeld
      • Groot

Klein

Witte knoppen

Gemiddeld

Kolommen

Het kolommen blok kan maximaal 4 kolommen beslaan en van iedere kolom kan een breedte worden ingesteld. Daarnaast kan via de selectie de ruimte tussen de kolommen ingesteld worden.
Binnen een kolom kunnen de volgende blokken gebruikt worden:

  • Knoppen
  • Paragraaf
  • Koptekst
  • Lijst
  • Afbeelding

Indeling van 2 kolommen – witruimte groot

Twee kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Twee kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Indeling van 3 kolommen – gemiddelde witruimte

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Indeling van 4 kolommen – kleine witruimte

Vier kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Vier kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Vier kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Vier kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Indeling van 3 kolommen – kleine witruimte gevarieerde kolombreedtes

foto dd 17-05-2019

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Drie kolommen indeling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet libero a velit lobortis gravida. Nulla lacinia nisi sem, vel tincidunt arcu venenatis et.

Container

Het container blok is een veelzijdig blok waarmee je de opmaak van een pagina naar een hoger niveau kan brengen. Dit blok is ideaal om een aantrekkelijke lay-out te creëren waarin media, kleur en tekst samenkomen. Binnen dit blok kan vervolgens weer een grote selectie van de andere blokken geplaatst wat veelzijdige combinaties mogelijk maakt.

Door de vele mogelijkheden van dit blok is hier een stap-voor-stap uitleg over hoe het blok werkt.

  1. Kader instellingen
    • Er kan gekozen worden om het blok gekaderd of over de gehele breedte te tonen.
  2. Witruimte
    • De witruimte kan geselecteerd worden. Bij geen witruimte is alleen de minimale witruimte aanwezig. Met witruimte is er aanzienlijk meer witruimte in de container aanwezig.
  3. Achtergrond
    • Hier kan de achtergrond van het blok ingesteld worden. Er kan een thema (licht en donker), een vaste achtergrond kleur, een afbeelding, een video of een handmatige achtergrond- en tekstkleur geselecteerd worden.

Container volledige breedte met witruimte en achtergrond kleur en een gecentreerde tekst.

Container volledige breedte zonder witruimte en achtergrond kleur en een gecentreerde tekst.

Container volledige breedte zonder witruimte en achtergrond kleur met daarbinnen een container gekaderd zonder witruimte. Hierdoor breekt de achtergrond uit het stramien en lijnt de tekst mooi uit met de tekst kolom.

Container volledige breedte met witruimte en met achtergrond kleur en daarbinnen een container gekaderd met witruimte. Hierdoor springt de tekst iets in en lijnt de achtergrond mooi uit met de tekstkolom. Door de ingestelde witruimte is het hier niet nodig om witruimte blokken te gebruiken.

Container volledige breedte met een afbeelding als achtergrond. Door met de instellingen te spelen en in combinatie met andere blokken kunnen hier mooie effecten mee gemaakt worden.

Combinatie met media en tekst

In combinatie met bijvoorbeeld een media en tekstblok en witruimtes zpnder dat er een afbeelding gekozen wordt kunnen er effecten zoals dit ontstaan.

Container volledige breedte met een video als achtergrond. Door met de instellingen te spelen en in combinatie met andere blokken kunnen hier mooie effecten mee gemaakt worden. In de instellingen kan nog aangegeven of de tekstkleur licht of donker moet zijn.

Media & tekst

Het media en tekst blok is een veelzijdig blok waarmee je eenvoudig afbeeldingen, video’s, of andere media naast tekst kunt plaatsen. Dit blok is ideaal om een aantrekkelijke lay-out te creëren waarin media en tekst naast of boven elkaar staan, wat vaak wordt gebruikt om bijvoorbeeld afbeeldingen met beschrijvingen of een combinatie van tekst en video weer te geven. Door de vele mogelijkheden van dit blok is hier een stap-voor-stap uitleg over hoe het media en tekst blok werkt.

  1. Media toevoegen – maak een keuze tussen een afbeelding of een video.
    • Afbeelding selecteer een bestaande afbeelding uit de mediabibliotheek of upload een nieuwe afbeelding.
  2. Positionering – In de rechterzijbalk van de editor, kun je bepalen of de media aan de linkerkant, aan de rechterkant of boven de tekst wordt geplaatst.
    • Links – media wordt links weergegeven en de tekst rechts
    • Rechts – media wordt rechts weergegeven en de tekst links
    • Bovenaan – media wordt boven de tekst weergegeven. Deze optie is het beste te gebruiken in combinatie met het kolommen blok. Zie voorbeeld Media en tekst binnen kolommen met uitlijning boven.
  3. Verhouding
    • Hier kun je de grootte van de linker- en rechterkant bepalen.
  4. Tekst uitlijning
    • Hier kan de uitlijning van de tekst ten opzichte van de media ingesteld worden.
  5. Witruimte
    • Hier kan een selectie gemaakt worden of het blok wel of niet voorzien moet worden van witruimte.
  6. Thema
    • Hier kan de achtergrondkleur van het blok ingesteld worden. Er kan een thema (licht en donker), een vaste achtergrond kleur of een handmatige achtergrond- en tekstkleur geselecteerd worden.

Media en tekst blok

Media links, titel, tekst en een knop als inhoud. Geen witruimte en 50/50 verdeling. Tekst uitlijning boven en een achtergrondkleur.

Media en tekst blok

Media rechts, titel, tekst en een knop als inhoud. Geen witruimte en 50/50 verdeling. Tekst uitlijning boven en een achtergrondkleur.

Media en tekst blok

Media boven, titel, tekst en een knop als inhoud. Geplaatst binnen een kolomblok.

Media en tekst blok

Media boven, titel, tekst en een knop als inhoud. Geplaatst binnen een kolomblok.

Introductie

Het introductie blok wordt gebruikt om een korte inleiding (vaak in een groter of afwijkende letter) weer te geven in bijvoorbeeld de header van de pagina. Er kan maximaal 1 introductieblok per pagina geplaatst worden.

Smalle kolom

Het Smalle Kolom-blok geeft je de mogelijkheid om gedeelten van je pagina in te springen en visueel te scheiden van de rest van de inhoud. Zo creëer je meer variatie en houd je de layout dynamisch en overzichtelijk. Om het Smalle Kolom-blok écht tot zijn recht te laten komen, kun je het combineren met andere blokken.

Smalle kolom optie 1

Dit is de smalste instelling die mogelijk is. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sit amet arcu purus. Nulla metus odio, viverra quis tellus in, sodales cursus risus. Suspendisse potenti. Mauris diam ante, consequat ultrices magna sit amet, vehicula accumsan augue.

foto dd 17-05-2019

Smalle kolom optie 2

Dit is de middelste instelling die mogelijk is. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sit amet arcu purus. Nulla metus odio, viverra quis tellus in, sodales cursus risus. Suspendisse potenti. Mauris diam ante, consequat ultrices magna sit amet, vehicula accumsan augue.

© foto Hoge Noorden / Jacob van Essen

Smalle kolom Optie 3

Dit is de breedste instelling van de smalle kolom die mogelijk is. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sit amet arcu purus. Nulla metus odio, viverra quis tellus in, sodales cursus risus. Suspendisse potenti. Mauris diam ante, consequat ultrices magna sit amet, vehicula accumsan augue.

Witruimte

Het Witruimte blok is een handig hulpmiddel waarmee je lege ruimte kunt toevoegen tussen blokken op je pagina of in je bericht. Dit blok voegt visuele luchtigheid toe en helpt om de lay-out van je content beter te structureren, vooral als je secties wilt scheiden of een bepaald element beter wilt laten opvallen door ruimte eromheen te creëren.

Door de schuifregelaar heen en weer te bewegen kan er uit 4 verschillende witruimtes gekozen worden.

Insluitingen

Embed

Het embed blok maakt het eenvoudig om inhoud van externe websites, zoals video’s, sociale media posts, muziek, documenten en meer, direct in je WordPress-pagina’s of -berichten in te voegen. Er is ondersteuning voor een breed scala aan populaire platforms, waardoor je gemakkelijk multimedia en andere bronnen kunt delen zonder handmatige code in te voegen.

Je kan een video embedded door het Embed, YouTube/Vimeo (of andere sociale media) blok te plaatsen en hier vervolgens de url naar de video in te plakken. Ook kan de link naar de video direct in de editor geplakt worden. Dan wordt dit automatisch omgezet naar het juiste embed blok.

YouTube

Video bron

Vimeo

Video bron

Soundcloud

Bron

Spotify

Bron

Formulieren

Het Formulieren blok maakt het eenvoudig om formulieren die je met de Gravity Forms plugin hebt gemaakt, direct in je pagina’s of berichten in te voegen. Gravity Forms is een populaire plugin waarmee je geavanceerde formulieren kunt maken voor contact, inschrijvingen, betalingen en meer.

Let er op dat de volgende instellingen worden toegepast (te vinden aan de rechterkant).

  • Formulier titel – uitgeschakeld
  • Formulier beschrijving – uitgeschakeld
  • Voorbeeld – ingeschakeld (onder Geavanceerd)
  • AJAX* – ingeschakeld (onder Geavanceerd)

* Als je wilt dat het formulier wordt ingediend zonder dat de pagina opnieuw wordt geladen (asynchroon), kun je de optie Ajax inschakelen selecteren. Dit zorgt voor een vloeiendere gebruikerservaring.

Handleiding formulieren module

Beheren en verwerken persoonlijke gegevens
Aan het verwerken van persoonlijke gegevens zitten

Naam(Vereist)
Geen titel
Geen titel
Adres(Vereist)
Laat ons weten wat je bezighoudt. Heb je een vraag voor ons? Stel hem gerust.