Afbeeldingen bijsnijden in WordPress

Soms komt je foto niet helemaal lekker uit de verf op de verschillende plaatsen door je site heen.
Zo kan een afbeelding als header er prima uitzien, maar als onderdeel van een overzichtspagina niet. Gelukkig heb je de mogelijkheid in WordPress om per functionele weergave een andere uitsnede te maken zonder dat je de originele foto aanpast.

Er zijn twee manieren om je afbeelding bij te snijden

1. via de Mediabibliotheek
   
2. via de pagina die je aan het beheren bent

Hieronder gaan we via de Mediabiblioheek een bestand bijsnijden. De stappen zijn hetzelfde als bij beheer via de pagina, alleen in de pagina moet je de afbeelding eerst klikken om te openen.

Stappenplan

1. Ga naar de mediabibliotheek en kies de afbeelding die je wilt bewerken

Je komt nu bij de Bijlage details. 

2. Kies rechtsonder voor de button 'Snijd uitgelichte afbeelding bij'

3. In het volgende venster zie je alle mogelijke uitsnedes van de afbeelding op je site

4. Kies de uitsnede die wilt optimaliseren. Deze verschijnt in de rechterkolom met kader die correspondeert met de verhouding van je gekozen uitsnede

Je kunt nu het kader verschuiven tot je de gewenste uitsnede hebt gevonden.

Hierboven valt op dat er een oranje uitroepteken staat met de tekst
 'De originele afbeelding is te klein om met goede kwaliteit bij te snijden.'

Dat betekent dat het originele bestand een kleinere pixelverhouding heeft dan nodig is voor deze uitsnede. Je gebruikt bijvoorbeeld een kleine foto voor een header. Je kunt de uitsnede wel maken, maar het kan resulteren in een lage kwaliteitsweergave op de site. Zorg altijd dat de gebruikte afbeelding groot genoeg voor de locatie waar je 'm wilt tonen. De minimale pixelverhouding staat achter de naam van de uitsnede. In dit geval 1420 x 1374 pixels. Het originele bestandsformaat is 2000x1333 dus qua breedte kom je wat tekort.

5. Klik vervolgens op de grote knop bovenaan: Bijsnijden opslaan om je wijzigingen te bewaren.

Een paar aanvullende opmerkingen:

- Deze uitsnedes zul je niet 1-op-1 gaan zien op de website zelf. We zetten elke site responsive op wat er voor zorgt dat afbeeldingen meeschalen met de schermresolutie en apparaat van de gebruiker. Dit gebeurt wél vanuit de uitsnede die je hebt bepaald.

- je hoeft niet elke uitsnede te definiëren. Niet elke afbeelding wordt op elke plek gebruikt.