Beginnershandleiding voor WordPress-afbeeldingsformaten (+ aanbevolen procedures)

Ontdek de basisprincipes van het aanpassen van de afbeeldingsgrootte in WordPress in deze gebruiksvriendelijke beginnershandleiding. Leer hoe WordPress automatisch miniatuur-, middelgrote en grote afbeeldingen maakt, waarom deze formaten belangrijk zijn voor de look en prestaties van je site, en hoe WP Media Folder je kan helpen georganiseerd te blijven.

 In deze handleiding worden de standaard afbeeldingsformaten van WordPress (miniatuur, medium, groot) uitgelegd, waarom ze bestaan en hoe je ze kunt aanpassen aan je thema. We laten je ook zien hoe de WP Media Folder plugin je kan helpen bij het beheren van je afbeeldingen. Ook als je geen technische achtergrond hebt, is dit eenvoudig te volgen. Je leert echter precies hoe WordPress omgaat met afbeeldingsformaten en hoe je ze kunt aanpassen.

Overzicht van standaard afbeeldingsformaten in WordPress

Wanneer je een afbeelding uploadt naar WordPress, worden er automatisch meerdere versies van die afbeelding aangemaakt die op verschillende plaatsen op je site worden weergegeven. Standaard genereert WordPress:

• Miniatuur : een vierkante versie van 150 × 150 pixels. Wordt vaak gebruikt in blogvoorbeeldlijsten, widgets en galerijen.
• Medium : een versie geschaald zodat de langste zijde 300 pixels is. Als je afbeelding hoger is dan breed, kan deze 300 pixels hoog zijn en een kleinere breedte, of andersom.
• Groot : een versie waarbij de langste zijde 1024 pixels is. Geschikt voor uitgelichte afbeeldingen over de volledige breedte of blogberichtheaders.
• Volledig : het exacte bestand dat u hebt geüpload, ongewijzigd.

WordPress selecteert de optimale weergavegrootte, afhankelijk van waar de afbeelding wordt weergegeven. Een kleine miniatuur in een berichtenlijst heeft een formaat van 150 × 150 pixels; een banner met een uitgelichte afbeelding mag maximaal 1024 px zijn. Dit systeem optimaliseert de laadsnelheid, het bandbreedtegebruik en de weergave op alle apparaten en schermformaten.

Waarom WordPress deze formaten automatisch genereert

• Om ervoor te zorgen dat afbeeldingen goed in de ontwerpgebieden passen (bijvoorbeeld niet vergroot of wazig).
• Om de bestandsgrootte te verkleinen en de prestaties bij het laden van pagina's te verbeteren, vooral op mobiele apparaten
• Om de workflow voor contentmakers te vereenvoudigen: handmatig aanpassen van de grootte is niet nodig.

Als de geüploade afbeelding kleiner is dan de grootte die WordPress genereert (bijvoorbeeld een foto van 800 px breed), dan genereert WordPress alleen formaten tot de afmetingen die de afbeelding ondersteunt. De grote afbeelding zal dus niet groter zijn dan de originele grootte.

Aanbevolen procedures voor het gebruik van standaardafbeeldingsformaten

Hier zijn enkele veelvoorkomende gebruiksgevallen voor elke standaardgrootte:

Miniaturen

Gebruik het voor galerijrasters, blogpostvoorbeelden, widgets of zijbalklijsten. Gebruik geen miniatuurformaat voor een groot weergavegebied; het ziet er dan gepixeld uit.

Voor dit voorbeeld hebben we een galerij gebruikt die is gemaakt met de WP Media folder.

Medium

Ideaal voor inline-afbeeldingen in blogberichten of kleinere banners. Deze bieden een goede balans tussen helderheid en bestandsgrootte.

Groot formaat

Gebruik dit voor afbeeldingen op volledige breedte, uitgelichte headers, schuifregelaars of gedeelten op volledig scherm. Vermijd het gebruik van originele afbeeldingen op volledige grootte, tenzij absoluut noodzakelijk (bijvoorbeeld foto's van hoge kwaliteit), omdat deze te groot kunnen zijn en de pagina langzaam laden.

Het uploaden van zeer grote originele bestanden (bijvoorbeeld duizenden pixels breed of TIFF- of PNG-afbeeldingen met een hoge resolutie) wordt afgeraden. Ze nemen meer opslagruimte in beslag en kunnen uw site of mediaserver vertragen. Upload idealiter afbeeldingen die zijn aangepast zodat ze ongeveer overeenkomen met de maximale weergavebreedte van uw thema (bijvoorbeeld 1200 px breed als uw contentgebied 1200 px is).

Hoe u de afmetingen van afbeeldingen voor uw thema kunt aanpassen

WordPress gebruikt standaard de formaten in Instellingen > Media , maar u kunt deze formaten aanpassen of nieuwe formaten toevoegen voor de vereisten van uw thema.

Standaardafmetingen wijzigen via de beheerdersschermen

Ga naar je WordPress-dashboard > Instellingen > Media. Hier kun je de pixelafmetingen voor Miniatuur, Medium en Groot wijzigen. Sla je wijzigingen op nadat je ze hebt aangebracht. Toekomstige uploads gebruiken de nieuwe instellingen.

Bestaande afbeeldingen die u al hebt geüpload, worden echter niet automatisch opnieuw gegenereerd. Als u later de afmetingen wijzigt, moet u een plug-in voor het opnieuw genereren van miniaturen gebruiken.

Aangepaste afbeeldingsgroottes toevoegen aan uw themacode

BELANGRIJKE OPMERKING: Pas geen aangepaste code toe zonder eerst een back-up te maken.

Om nieuwe afbeeldingsformaten te registreren die groter zijn dan miniatuur/medium/groot, kunt u code toevoegen aan het bestand functions.php van uw thema of aan een aangepaste plug-in. Voorbeeld:

add_image_size( 'aangepaste-functie', 800, 600, true ); 

Hiermee wordt een nieuwe grootte met de naam 'custom-feature' geregistreerd, met een breedte van 800px, een hoogte van 600px en bijsnijden ingeschakeld.

Dan kun je het in je themabestanden aanroepen:

the_post_thumbnail( 'aangepaste-functie' ); 

Of in Gutenberg ziet u mogelijk de nieuwe grootte in de vervolgkeuzelijst met afbeeldingsblokken, als uw thema dit ondersteunt.

Je kunt meerdere aangepaste formaten toevoegen. Nadat je ze hebt geregistreerd, genereer je opnieuw miniaturen voor bestaande afbeeldingen, zodat WordPress de nieuwe versies kan aanmaken.

Aanbevolen procedures bij het kiezen van uw aangepaste formaten

• Pas de afmetingen aan de lay-out van je thema aan. Bijvoorbeeld de grootte van de headerbanner, de grootte van de uitgelichte blogpost of de breedte van de afbeelding in het artikel.
• Vermijd het aanpassen van de grootte van afbeeldingen naar formaten die veel groter zijn dan containers. Deze verspillen schijfruimte en vertragen het laden.
• Gebruik bijsnijden als u afbeeldingen met een consistente beeldverhouding wilt, bijvoorbeeld 16:9 of 4:3. Stel bijsnijden in op true of false, afhankelijk van of u bijsnijden of proportioneel schalen wilt.
• Test de ingevoegde afbeeldingen nadat u aangepaste formaten hebt toegevoegd om te controleren of ze correct worden weergegeven op desktop en mobiel.

Miniaturen regenereren

Als je de standaardformaten wijzigt of nieuwe formaten toevoegt, worden oude afbeeldingen niet automatisch voorzien van de nieuwe formaten. Gebruik een plugin zoals "Regenereer thumbnails" of iets dergelijks om alle afbeeldingsformaten voor eerdere uploads opnieuw te genereren. Zo zorg je ervoor dat je mediabibliotheek de juiste formaten heeft die WordPress in verschillende contexten kan weergeven.

Samenvatting van beste praktijken

• Upload afbeeldingen met een formaat dat dicht bij de maximale weergavebreedte van je thema ligt (bijv. 1200 px breed). Laat WordPress kleinere formaten creëren.
• Houd de standaardformaten aan op 150 px (miniatuur), 300 px (medium) en 1024 px (groot), tenzij je thema andere waarden vereist. Wijzig deze waarden onder Instellingen > Media.
• Voeg aangepaste formaten toe via add_image_size() in uw thema of plugincode voor unieke weergavegebieden (bijvoorbeeld hero banners, uitgelichte blokken).
• Nadat u de afmetingen hebt aangepast of nieuwe afmetingen hebt toegevoegd, kunt u de miniaturen opnieuw genereren, zodat WordPress voor oude uploads de juiste afmetingen aanmaakt.
• Gebruik bijsnijden als een consistente beeldverhouding vereist is, of proportioneel schalen als u de oorspronkelijke verhoudingen wilt behouden.

Extra tip: WP Media Folder in gedachten Als u behoefte hebt aan mapgebaseerde organisatie, verbeterde mediazoek- en filterfuncties, eenvoudigere galerijcreatie, mediavervanging en andere workflowverbeteringen. Het werkt naadloos samen met uw instellingen voor de afbeeldingsgrootte.

Afronden: Beheers de WordPress-afbeeldingsformaten voor snelle, mooie sites

Inzicht in de afbeeldingsformaten van WordPress helpt je de juiste afbeelding op de juiste plaats weer te geven. Miniatuur, medium en groot zijn ontworpen om kwaliteit en prestaties in balans te brengen. Je kunt deze formaten aanpassen of nieuwe toevoegen om ze af te stemmen op de lay-out van je thema. WP Media Folder combineert mapstructuur, geavanceerd beheer, vervangingstools, watermerken en galerijtools met het standaard mediasysteem van WordPress.

Zelfs als je jezelf niet technisch vindt, zijn deze stappen eenvoudig: pas de instellingen aan onder Media, installeer de regeneratieplugin na wijzigingen, registreer optioneel aangepaste formaten in je thema en gebruik WP Media Folder om je mediabibliotheek efficiënter te organiseren. Zo zien je afbeeldingen er fantastisch uit, laden ze snel en zijn ze gemakkelijk te beheren.