WordPress - Uitgelichte afbeelding


WordPress kent de mogelijkheid om aan een bericht of aan een pagina een uitgelichte afbeelding (featured image) toe te voegen. Deze afbeelding kan bijvoorbeeld worden gebruikt in het overzicht met berichten. De mogelijkheid om een afbeelding toe te kunnen voegen moet wel worden geactiveerd in het gebruikte thema. Gebruik je een standaard thema dan zal de feature waarschijnlijk al geactiveerd zijn, heb je een eigen thema gemaakt dan zul je de feature nog wel moeten activeren. Dit kan gedaan worden door de onderstaande code toe te voegen aan het functions.php bestand van het gebruikte thema.

if(function_exists('add_theme_support'))
        add_theme_support('post-thumbnails');
endif;


Daarna kan een afbeelding worden opgeroepen in een overzicht (archive.php, index.php, search.php) of op de detailpagina (single.php) middels de onderstaande code. In het onderstaande geval gaat het om een voorwaarde. Er wordt eerst gecheckt of de afbeelding is toegevoegd. In dit niet het geval is kun je eventueel een standaard afbeelding instellen.

<?php
        $featured = get_the_post_thumbnail($post->ID, 'thumbnail', true);
        if ($featured == ''):
                echo '';
        else:
                echo $featured;
        endif;
?>


Alleen URL opvragen

Om alleen de URL van een thumbnail op te vragen kan de volgende code worden gebruikt. Deze moet dan nog wel in een img tag worden geplaatst of als achtergrond van een element worden ingesteld. Ook hier een controle of er een afbeelding beschikbaar is.

<?php
        $featured = wp_get_attachment_url(get_post_thumbnail_id($post->ID));
        if ($featured == ''):
                echo '';
        else:
                echo $featured;
        endif;
?>

Afmetingen toevoegen

Indien je specifieke afmetingen wilt gaan instellen voor uitgelichte afbeeldingen dan kan dit op de volgende manier. Met de onderstaande code voeg je een eigen gewenste afmeting toe aan het thema, deze code dient geplaatst te worden in het bestand functions.php.

Wat er met de onderstaande code ingesteld is, is dat er een afbeelding wordt gegenereerd van 350 pixels bij 200 pixels, ongeacht de verhouding van de originele afbeelding.

add_image_size('uitgelichte-afbeelding',350,200,true);


Als alternatief is er onderstaande optie waarbij de toevoeging 'true' is komen te vervallen. In dat geval zal WordPress de correcte verhouding van de afbeelding behouden bij het schalen echter kan dit ongewenste resultaten opleveren. Je kunt hierbij eventueel ook de hoogte (200) weglaten zodat de afbeelding alleen qua breedte zal worden geschaald.

add_image_size('uitgelichte-afbeelding',350,200);


Het aanroepen van de nieuwe uitgelichte afbeelding gaat als volgt.

<?php
        $featured = get_the_post_thumbnail($post->ID, 'uitgelichte-afbeelding', true);
        if ($featured == ''):
                echo '';
        else:
                echo $featured;
        endif;
?>


Afbeeldingen genereren

Indien je een bestaande website bijvoorbeeld een nieuw ontwerp geeft kan het zijn dat de afmetingen van de uitgelichte afbeeldingen gewijzigd zijn. In dat geval kan de plugin Regenerate Thumbnails erg van pas komen. Met deze plugin kun je eenvoudig alle bestaande afbeeldingen opnieuw laten schalen op basis van de nieuwe instellingen.