Met WordPress kun je op verschillende manieren afbeeldingen aan je site toevoegen. Een van de meest effectieve manieren is om afbeeldingen in kolommen en rijen toe te voegen. Zo kun je je afbeeldingen op een georganiseerde manier presenteren.

In deze blogpost laten we je zien hoe je WordPress afbeeldingen op verschillende manieren kunt weergeven in Kolommen & Rijen.

• Methode 1: Het Kolomblok gebruiken (Het beste voor volledig handmatige bediening en aangepaste lay-outs)
• Methode 2: Het Galerij-blok gebruiken (Het beste voor eenvoudige afbeeldingsrasters met minimale styling)
• Methode 3: Het Galleryberg-blok gebruiken (Beste voor geavanceerde lay-outs met lightbox en aanpassingen)
• Methode 4: De Tableberg-plugin gebruiken (Het beste voor gestructureerde afbeeldingsrasters zoals prijzen, schema's of producttabellen)

Maak prachtige tafels
Met blok-editor

Probeer gratis

Krijg Pro

Methode 1: Het kolomblok gebruiken

WordPress heeft een standaard kolomblok. Je kunt er nog veel meer blokken aan toevoegen, waaronder het afbeeldingsblok. Dit is de handleiding.

Stap 01: Het Gutenberg Kolomblok toevoegen

Vinden en Kolom toevoegen door op het pluspictogram (+) in de editor te klikken.

Selecteer het aantal kolomvariaties dat je wilt toevoegen aan het kolomblok. Voor deze tutorial selecteren we de 50/50 kolomvariatie.

Stap 02: Het afbeeldingsblok toevoegen aan het kolomblok

Zoals we al zeiden, kun je andere Gutenberg-blokken binnen het kolomblok plaatsen. Nu, klik op het pluspictogram (+) binnen de kolom. Zoeken en het blok Afbeelding toevoegen aan.

Je kunt nu afbeeldingen toevoegen vanuit de Mediabibliotheek of de lokale schijf. Doe wat je wilt.

Stap 03: Het afbeeldingsblok stylen binnen het kolomblok

Je ziet dat we een afbeelding hebben toegevoegd. Je kunt deze centraal uitlijnen met de uitlijnoptie op de werkbalk. Pas de grootte van de afbeelding aan met het pictogram met de randcirkel. Tot slot kun je de afbeelding verder stileren met de opties op het tabblad Stijl.

Voeg op dezelfde manier ook een afbeelding toe aan de andere kolom.

Methode 2: Het Galerij-blok gebruiken

WordPress heeft een standaard Galerij blok waarmee je meerdere afbeeldingen kunt toevoegen met dezelfde blok lay-out.

Stap 01: Het galerijblok toevoegen

Vind en het blok Galerij toevoegen aan de editor.

Je mag afbeeldingen uploaden vanaf je lokaal station of de Mediatheek. In deze tutorial uploaden we afbeeldingen vanuit de Mediabibliotheek.

Stap 02: Afbeeldingen selecteren en uploaden

Selecteer de afbeeldingen die je wilt uploaden naar het Galerij-blok. Je kunt zoveel afbeeldingen selecteren als je wilt. Eenmaal klaar, klik op de knop Een nieuwe galerij maken.

Als je wilt, kun je bijschriften toevoegen aan elke afbeelding. Geen probleem als je niets toevoegt. Klik op de Knop Galerij invoegen aan het einde.

Je kunt zien dat er afbeeldingen zijn toegevoegd aan de galerij. Vervolgens kunt u het blok Afbeelding aanpassen met opties uit de Instellingen en Tabblad Stijlen op de rechterzijbalk.

Hopelijk kun je het alleen, dus ik ga niet in op de details.

Methode 3: De Galleryberg-plugin gebruiken

Als je op zoek bent naar een flexibelere en visueel opgepoetste manier om afbeeldingen in kolommen of rijen weer te geven, dan is de Galerijberg plugin is een fantastische keuze. Het is een Gutenberg-native galerijblok plugin die je het volgende geeft meerdere lay-out opties - zoals Tegels, Metselwerk, Recht en Vierkant - allemaal met ingebouwde lichtbak ondersteuning.

Stap 1: Installeer de Galleryberg-plugin

Ga naar je WordPress dashboard en navigeer naar Plugins > Nieuwe toevoegen. Zoek dan naar "Galleryberg" en installeer en activeer de plugin.

Stap 2: Het Galleryberg-blok toevoegen

Open de pagina of het bericht waar je de afbeeldingen wilt weergeven. Klik vervolgens op de + knop en zoek naar de "Galerijberg" blok. Voeg het toe aan de pagina.

Stap 3: afbeeldingen uploaden of selecteren

Gebruik de mediabibliotheek of upload nieuwe afbeeldingen. Je kunt afbeeldingen herschikken door ze te verslepen.

Stap 4: Kies een lay-out

Selecteer de gewenste lay-out in het paneel met blokinstellingen:

• Tegels: Rasterindeling met gelijke tussenruimte (ideaal voor rijen en kolommen)
• Metselwerk: Gestapelde lay-out in Pinterest-stijl
• Gerechtvaardigd: Netjes uitgelijnde rijen van gelijke hoogte
• Vierkant: Perfecte vierkanten voor uniforme rasterweergave

Stap 5: De Lightbox-optie inschakelen

Schakel in de zijbalk met blokinstellingen de optie Lightbox inschakelen optie.

Je afbeeldingen worden nu geopend in een popup met vloeiende overgangen, zoomeffecten en dianavigatie.

Stap 5: Aanpassen en publiceren

• Stel het aantal kolommen in (van 1 tot 8)Blader in de zijbalk met blokinstellingen naar beneden naar de optie Lichtbak sectie.
• Schakel de Lightbox inschakelen optie.
• Je afbeeldingen worden nu geopend in een popup met vloeiende overgangen, zoomeffecten en dianavigatie.
• Pas de spatiëring, bijschriften, randen en meer aan
• Lightbox inschakelen voor interactieve afbeeldingsvoorbeelden

Klik op Publiceer of Update en je galerij verschijnt in duidelijke, responsieve rijen en kolommen.

Methode 4: De Tableberg-plugin gebruiken

TableBerg is een gebruiksvriendelijke plugin voor het maken van tabellen. Hiermee kun je verschillende aangepaste blokken aan de tabelcellen toevoegen om multifunctionele tabellen te maken. In dit gedeelte laten we je zien hoe je afbeeldingen kunt toevoegen in WordPress met behulp van de Tafelberg plugin.

Stap 01: De Tableberg-plugin installeren en activeren

Ga naar Plugins > Nieuwe plug-in toevoegen. Type Tafelberg in het zoekvak. Installeer en activeren zodra de plugin hieronder verschijnt.

Stap 02: Voeg het Tableberg-blok toe aan je bericht/pagina

De plugin wordt geleverd met een Gutenberg-blok met de naam TableBerg. Zoek en voeg de TabelBerg blok naar je redacteur.

Definieer het rij- en kolomnummer voor de tabel. Het proces is vergelijkbaar met het standaard tabelblok. Doe het zelf.

Stap 03: Het afbeeldingsblok zoeken en toevoegen aan de tabel

Hopelijk is je tabel klaar. Selecteer de cel waar je een afbeelding wilt toevoegen. Zodra je een cel hebt geselecteerd, wordt de plus (+) pictogram verschijnt.

Klik op het pluspictogram (+). Je krijgt het blok Afbeelding. Klik op het blok Afbeelding.

Je krijgt opties om afbeeldingen te uploaden vanaf de lokale schijf of de Mediabibliotheek. Klik op de gewenste optie en upload de afbeelding.

Stap 04: De geüploade afbeelding stylen

Hopelijk is je afbeelding al geüpload naar de tabel. Ga naar het tabblad Stijlen in de rechter zijbalk. Daar vind je opties zoals Duotone, Border en Radius om je afbeeldingsblok te stylen.

Je kunt dus afbeeldingen uploaden naar de WordPress tabel met de plugin. Verken hoe maak je een teamlid sectie in WordPress met behulp van het kolomblok.

Laatste opmerkingen!

Om een website succesvol te onderhouden, moet je je inhoud op verschillende manieren uploaden en presenteren. Soms moet dezelfde inhoud op verschillende manieren in verschillende berichten en pagina's worden gepresenteerd. En dat geldt ook voor het afbeeldingsblok.

Hopelijk ben je na het lezen van deze tutorial in staat om je afbeeldingsblok op verschillende manieren toe te voegen in WordPress en variaties aan te brengen in de inhoud.

<p>The post How to Display WordPress Images in Columns & Rows first appeared on Tableberg.</p>

Een effectieve manier om afbeeldingen te laten zien is door ze naast elkaar te plaatsen. Deze techniek is vooral handig bij het vergelijken van meerdere producten, het presenteren van voor en na afbeeldingen en het vertellen van een verhaal.

In dit artikel laten we je drie eenvoudige manieren zien om afbeeldingen naast elkaar te zetten in WordPress.

• Methode 1: Het Galerij-blok gebruiken
• Methode 2: Het blok Kolommen gebruiken
• Methode 3: Het Tableberg-blok gebruiken

Maak prachtige tafels
Met blok-editor

Probeer gratis

Krijg Pro

Eerste methode: het Galerij-blok gebruiken

WordPress wordt geleverd met het standaard Galerij-blok. Je kunt afbeeldingen op de volgende manieren naast het blok presenteren.

Stap 01: Voeg het galerijblok toe aan WordPress

Open gewoon een bericht of pagina. Zoek de Galerij blok in de Gutenberg blokbibliotheek door op de knop plus (+) knop. Voeg het toe aan de editor.

Klik op de Uploadknop om nieuwe afbeeldingen van je lokale opslag aan de zijkant toe te voegen. Je kunt ze ook uploaden vanuit je bestaande bestanden door op de knop Mediatheek knop.

Voor deze tutorial uploaden we afbeeldingen vanuit de Mediabibliotheek. Selecteer de afbeeldingen die je wilt toevoegen. Klik op de knop Een nieuwe galerij maken knop aan het einde.

Zodra afbeeldingen zijn toegevoegd aan de editor, zie je ze naast elkaar verschijnen. Vervolgens kun je de instellingen en styliseringen van het Galerij-blok aanpassen met behulp van de respectieve opties op de rechter zijbalk.

Opmerking: Als je afbeeldingen standaard niet naast elkaar worden weergegeven, selecteer dan het hele blok door op de knop Pictogram galerij op de werkbalk. Geef de kolomnummers op in de rechter zijbalk.

Tweede methode: het blok Kolommen gebruiken

Met het blok Kolom kun je verdeel je inhoud in meerdere kolommen. Je kunt andere blokken toevoegen om verschillende soorten inhoud aan elke kolom toe te voegen.

Stap 01: Het kolomblok toevoegen aan je site

Voeg de Kolom blok naar je editor op dezelfde manier als hierboven beschreven.

Selecteer de kolomindeling die je wilt. Je kunt een gelijk aantal afbeeldingen naast elkaar weergeven, overeenkomstig met het aantal kolommen dat je toevoegt. We hebben de lay-out met twee kolommen geselecteerd voor het blok.

Voeg de Beeldblok door op de plus (+) knop binnen de Kolom blok.

Upload een afbeelding op dezelfde manier als we je hierboven hebben laten zien.

Opmerking: Aangezien dit het blok Afbeelding is, kun je slechts één afbeelding toevoegenin tegenstelling tot het blok Galerij.

Voeg op dezelfde manier de Beeldblok weer naar de tweede kolom.

Je ziet dat de tweede afbeelding naast de eerste is verschenen. Je kunt nu één voor één alternatieve teksten en andere instellingen voor de afbeeldingen toevoegen.

Derde methode: Het Tableberg-blok gebruiken

Tafelberg is een invoegtoepassing voor het maken van tabellen op basis van blokken. Je kunt er ook kolommen mee maken en afbeeldingen naast elkaar weergeven. Volg de onderstaande stappen na installeren en activeren de plugin.

Stap 01: het TableBerg-blok toevoegen

De plugin wordt geleverd met een TabelBerg blok. Voeg het toe aan uw editor.

Je kunt meerdere rijen selecteren als je dat wilt. Maar we leggen de tutorial van vandaag uit met een enkele rij en meerdere kolommen.

Met TableBerg kun je verschillende soorten blokken toevoegen aan de cellen van de tabel. Voeg de Beeldblok naar de tabelcellen.

Een afbeelding uploaden naar de tabelcel op dezelfde manier als in de twee bovenstaande methodes.

Blijf afbeeldingen toevoegen aan andere kolommen van de tabel met behulp van de Beeldblok. Ik hoop dat je het alleen kunt.

Zie de afbeelding hieronder. We hebben drie afbeeldingen naast elkaar weergegeven in de tabel die is gemaakt met het TableBerg-blok.

# Verwijder de tabelrand

Je ziet een rand rond de tabel. Om deze te verwijderen, klik op het TableBerg-pictogram drie keer op de werkbalk. Ga naar Tabblad Stijlen > Rand op de rechterzijbalk. Zet de waarde nul (0) om de grootte van de tabelrand te definiëren.

Zo kun je afbeeldingen naast elkaar weergeven op WordPress websites.

Conclusie

Afbeeldingen naast elkaar tonen is zeer voordelig, terwijl een visuele vergelijking tussen verschillende producten, opties, functies en variaties essentieel is. Hopelijk kun je het vandaag alleen met deze tutorial.

Je kunt meer doen op je site door verschillende soorten tabellen te maken met de TableBerg plugin. Kijk eens naar hoe maak je een Amazon productvergelijkingstabel in WordPress.

<p>The post How to Put Images Side by Side in WordPress (Three Ways) first appeared on Tableberg.</p>