Cambiare dimensioni del post_thumbnail()

Cambiare le dimensioni dell’immagine in evidenza via template in wordpress è un’operazione piuttosto semplice, vediamo che cosa e dove scrivere il codice che ci permette di sfruttare questa funzione al meglio.

Aggiungere il supporto della funzione al nostro tema

Per prima cosa, all’interno del file functions.php, andiamo ad inserire il codice seguente:

if ( function_exists( 'add_theme_support' ) ) {
	add_theme_support( 'post-thumbnails' );
        set_post_thumbnail_size( 150, 150 ); // default Post Thumbnail dimensions   
}

Così facendo ci assicuriamo che il nostro tema supporti la funzione post-thumbnails per mostrare le immagini in evidenza. Fatto ciò andiamo a stabilire la dimensione di default che avranno le nostre immagini attraverso la funzione set_post_thumbnail_size().

Successivamente andiamo a definire formati diversi in modo da poter mostrare, in contesti diversi, immagini più o meno grandi, tagliate o non. Per farlo aggiungiamo in seguito a quanto appena scritto:

if ( function_exists( 'add_image_size' ) ) { 
	add_image_size( 'category-thumb', 300, 9999 ); //300 pixels wide (and unlimited height)
	add_image_size( 'homepage-thumb', 220, 180, true ); //(cropped)
}

Verifichiamo che sia supportata la funzione add_image_size() ed andiamo quindi a definire due set di thumbnails che avranno dimensioni diverse tra loro.

Nel primo caso (associato a ‘category-thumb’) effettuiamo un taglio all’immagine originale affinchè abbia dimensioni di 300 pixels il larghezza x 9999 pixels in altezza. Va precisato che, senza la definizione di un terzo parametro, wordpress utilizza la dimensione inferiore come riferimento per ridimensionare. Questo significa che se l’immagine di partenza ha delle proporzioni totalmente diverse da quelle che abbiamo previsto e non è sufficientemente grande, otterremo un’immagine che non riempie a sufficienza lo spazio interessato. In breve l’immagine viene scalata proporzionalmente.

Nel secondo caso (associato a ‘homepage-thumb’) invece, settando true, attiviamo la funzione di hard-crop, forzando il taglio dell’immagine affinchè abbia esattamente la dimensione prefissata.

Come inserire nel template le nuove immagini ridimensionate

Una volta dichiarate le nostre funzioni, ed aver associato a ‘category-thumb’ e ‘homepage-thumb’ i valori preimpostati delle dimensioni che vogliamo abbiano le nostre immagini, andiamo nel nostro template e, all’interno del loop, scriviamo:

<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'category-thumb' ); } ?>

oppure:

<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'homepage-thumb' ); } ?>

Che significa: se è presente un’immagine in evidenza, mostrami quell’immagine ridimensionata secondo quando dichiarato per ‘category-thumb’ (nel primo caso) o ‘homepage-thumb’ nel secondo caso.

Ho fatto tutto ma non funziona, perchè?

Ho eseguito tutta la procedura descritta ma continuo a vedere le mie immagini in modo sbagliato e, spesso, non vengono tagliate correttamente, perchè?
La faccenda è semplice, ma conoscerla ci permette di non perdere ore ed ore a scervellarsi…
WordPress ha bisogno di rigenerare tutte le thumbnails affinchè anche le precedenti immagini vengano correttamente ridimensionate! Come fare? Possiamo servirci di un qualsiasi plugin che svolga questa funzione.
Un plugin che si occupa di questo è, ad esempio, Regenerate Thumbnails. E’ sufficiente installarlo e seguire le istruzioni!
Ah, se state impazzendo ancora, provate a cambiare il nome associato al resize/taglio…