De WordPress Afbeeldingsblok is super helpful when inserting and showcasing a single image on your website. But if you want to display multiple photos at once, the Gallery block is the right choice.
Therefore, you must learn how to use the gallery block in WordPress. Once you master the gallery block’s features, you can use it to enhance your website’s visuals, making it more professional and appealing.
Vandaag bespreken we in deze tutorial het WordPress galerijblok, de functies van de werkbalk, de aanpassingsmogelijkheden en hoe je het goed kunt gebruiken. Volg ons van begin tot eind.
Wat is het WordPress Galerij Blok?
Het WordPress Galerij blok is a core block in the WordPress block editor. It lets you create and display a collection of images in a rooster format. It is perfect for displaying event photos, organizing images into an attractive layout, or presenting images with minimal effort.
Als je het blok gebruikt, profiteer je van bepaalde functies. Bekijk deze functies hieronder.
- Aanpassing: Pas kolommen, ruimte en bijschriften aan aan je ontwerp. Je kunt ook verschillende resoluties instellen voor individuele afbeeldingen in de galerij.
- Responsief ontwerp: Afbeeldingen passen zich automatisch aan verschillende schermformaten aan voor een naadloze ervaring op mobiel, tablet en desktop.
- Ingebouwde integratie: Je hebt geen extra plugins nodig; het blok werkt rechtstreeks in WordPress.
- SEO-vriendelijk: Alt text and captions can improve your content’s accessibility and search engine ranking. You can also set ALT text for separate images within the gallery.
Werkbalkfuncties van het galerijblok
Wanneer je het galerijblok invoegt, verschijnt er een werkbalk bovenaan het galerijblok met verschillende functies om je galerij aan te passen. Deze functies vindt u hieronder.
- Transformeren: Je kunt dit blok transformeren in een blok Afbeelding, Kolommen, Details en Groep.
- Slepen: Hiermee kunt u het speciale blok naar elke gewenste plaats in de editor slepen.
- Bewegende handgreep: Laat je blok op en neer bewegen.
- Uitlijnen: Met de uitlijningsoptie kun je de uitlijning van de afbeelding instellen op Geen, Breedte, Volledige breedte, Links, Midden en Rechts.
- Link: Met deze optie kun je links toevoegen voor geselecteerde inhoud binnen het blok.
- Bijschrift: Je kunt bijschriften toevoegen met de editoroptie voor elke afbeelding.
- Toevoegen: Met de optie Toevoegen kun je nieuwe afbeeldingen toevoegen of uploaden naar de galerij.
- Meer opties: Biedt meer opties met betrekking tot de sectie van het blok, zoals dupliceren, kopiëren, groeperen, enz.
Het galerieblok gebruiken in WordPress
Using the Gallery block in WordPress is simple. Just follow the below steps:
Stap 1: Galerijblok toevoegen in de editor
Open het bericht of de pagina, klik op het pictogram "+" om een blok toe te voegen en zoek naar "Galerij". Selecteer het Galerij-blok om het in je bericht of pagina in te voegen.
Stap 2: Upload je afbeeldingen
Je kunt je afbeeldingen uploaden of je afbeeldingen selecteren in de mediabibliotheek.
Hoe afbeeldingen invoegen via de Uploadoptie
Klik op de knop uploaden om afbeeldingsbestanden in te voegen, selecteer je afbeeldingen met je cursor terwijl de CTRL-toets ingedrukt houden van je toetsenbord en klik op openen. Dat is het. Je kunt je afbeeldingen zien in de editor.
Hoe een afbeelding invoegen via de optie Mediabibliotheek
Klik op de knop Mediabibliotheek, selecteer je afbeeldingen en klik op de knop Een nieuwe galerij maken en Galerij invoegen om de afbeeldingen in de editor in te voegen.
Als je alle afbeeldingen in de galerij hebt geplaatst, zie je alle werkbalkfuncties van het afbeeldingsblok. Je kunt deze functies bekijken hier.
Stap 3: Galerij aanpassen
Ga voor galerijaanpassingen naar Instellingen (1) > Blokkeren (2) > Instellingen (3). Je vindt de opties om kolommen, resolutie en andere opties te selecteren.
- Kolommen: Met kolommen kun je bepalen hoeveel afbeeldingen je wilt weergeven in je editor. Hoe meer afbeeldingen je toevoegt, hoe meer kolommen er worden toegevoegd aan de Galerij. (4)
- Resolutie: Je kunt de afbeeldingsresolutie instellen op Miniatuur en Volledig formaat. (5)
- Afbeeldingen passend maken: Deze functie handhaaft de verhouding van elke afbeelding en zorgt ervoor dat het formaat past.
- Willekeurige volgorde: Deze functie houdt de serie niet bij, maar geeft beelden weer met een willekeurige serie.
De optie Styles heeft de volgende opties.
- Kleur: Met de optie Kleur kun je de achtergrondkleur van je galerijblok wijzigen.
- Afmetingen: Met de optie Dimensions kun je de Block spacing (ruimte tussen twee blokken zoals afbeeldingen), margin en padding aanpassen.
- Rand & Straal: Met deze functie kun je een rand, randkleur en randradius aan je galerij toevoegen.
Hier is de volledige demo van de galerij die ik heb gemaakt.
Create an Interactive Gallery with Galleryberg
While the default Gallery block is excellent for simple grids, it lacks features such as a lightbox, hover effects, and diverse layouts.
If you want a more engaging gallery without writing code, the Galerijberg plugin is a free alternative that extends the block editor with extra tools. It lets you switch between tile, masonry, justified, and square layouts, and adds a built‑in lightbox for zooming and navigation.
Galleryberg also includes subtle hover effects and responsive controls so your galleries feel modern on desktop and mobile.
Now let’s see how to use the Galleryberg plugin.
Stap 1: Installeer de Galleryberg-plugin
Go to your WordPress dashboard and navigate to Plugins → Add New and search for Galleryberg. Then install and activate the plugin.
Step 2: Insert the Galleryberg Gallery Block
Create a new post/page or edit an existing one. Click the “+” button, search for Galleryberg, and add the block.
Step 3: Add Your Images
Upload new images or select them from the Media Library and click Select.
Stap 4: Kies een lay-out
By default, the block uses a Tiles layout. In the block’s sidebar, you can switch to Metselwerk, Gerechtvaardigdof Vierkant to better match your design.
Each layout automatically rearranges the images, and you can adjust the columns, spacing, and borders.
Step 5: Enable the lightbox
Toggle Enable Lightbox in the block settings to let visitors click an image and view it in a pop‑up with zoom and slide navigation.
The lightbox includes keyboard and touch controls, so it works smoothly on desktops and phones.
Step 5: Explore hover effects and captions
Use the Caption settings to display text below images or as an overlay that appears on hover. Galleryberg’s hover animations (zoom in/out and overlays) make the gallery feel interactive without distracting the
Stap 6: Voorbeeld bekijken en publiceren
Once satisfied, preview your gallery and publish or update the post. Your gallery will be responsive and performance‑optimised thanks to server‑side rendering.
Why Use Galleryberg Instead of the Core Block?
The core Gallery block offers basic grid layouts but lacks features such as a lightbox, hover animations, and varied layouts. Galleryberg provides four different gallery styles, a responsive lightbox with zoom and keyboard navigation, and intuitive controls for spacing, colors, and captions. It even supports responsive hover effects to add subtle animations. If you need a gallery that encourages visitors to interact with your images and fits seamlessly into the block editor, Galleryberg is a lightweight, user‑friendly solution.
Laatste gedachten!
Het Galerij-blok is een krachtig hulpmiddel met de Gutenberg-blokeditor. Hiermee kun je je afbeeldingencollecties weergeven zonder extra plugins.
Het is een uitstekende keuze voor iedereen vanwege de flexibiliteit, aanpassingsmogelijkheden en naadloze integratie met WordPress.
Probeer het uit en zie hoe het de manier waarop je afbeeldingen op je website laat zien kan veranderen.
Laat me weten wat je van de tutorial vindt in het commentaargedeelte hieronder. Laat het ook je medemensen weten via je sociale media.
Lees meer!
