info@nebulosaweb.com

Related Post in WordPress con YARPP

related posts

Negli ultimi tempi mi sono trovato a lavorare spesso su WordPress e a testare vari plug-in per arricchirlo di funzionalità. Tra le varie soluzioni provate per i related posts quella che mi è sembrata più interessante è YARPP (Yet Another Related Posts Plug-in).
A differenza di molti altri plug-in che mostrano gli articoli che hanno solo tags comuni (risultato per altro ottenibile facilmente aggiungendo alcune righe di codice nel file single.php), questo plug-in oltre a questi ultimi tiene in considerazione anche titoli, contenuti e categorie.
Le qualità di questo plug-in non sono finite, infatti basta andare nelle sue impostazioni per scoprire che è possibile personalizzare il filtro dei post correlati settando il valore di corrispondenza, escludendo particolari categorie o tags o scegliendo cosa tenere in considerazione per trovare relazioni tra i post.
Altra caratteristica degna di nota è la possibilità di personalizzare il template dei related posts aggiungendo un file nella cartella del template in uso nel vostro sito.

Passiamo ora alla parte pratica relativa all’installazione e alla configurazione di YARPP.
Prima di tutto scarichiamo l’ultima versione del plug-in e poi carichiamo yet-another-related-posts-plugin nella cartella wp-content/plugins/, o più semplicemente eseguiamo l’operazione dal pannello amministrativo di WordPress andando su Plugin > Aggiungi nuovo cercando “Yet Another Related Posts Plugin”.

A questo punto creiamo il file yarpp-template-1.php e al suo interno inseriamo il seguente codice:

<h3 id="related">Articoli correlati</h3>
<?php if ($related_query->have_posts()):?>
<ul id="relatedPosts">
    <?php while ($related_query->have_posts()) : $related_query->the_post(); ?>
    <li>
    <?php echo '<img class="alignleft" src='.get_bloginfo( "template_directory" ).'/scripts/timthumb.php?src='.catch_that_image().'&w=75&h=75" height="75" width="75" alt="'.the_title("","",FALSE).'"'; ?>
    <h4><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h4>
    <?php the_content_rss("", FALSE, "", 30); ?>
    </li>
    <?php endwhile; ?>
</ul>
<?php else: ?>
<p>Nessun articolo correlato.</p>
<?php endif; ?>

Adesso andate nelle impostazioni di YARPP e spuntate la casellina “Mostra utilizzando un file template personalizzato” per attivare il template.

Il codice riportato presenta una mia aggiunta che permette di visualizzare l’immagine di anteprima dell’articolo sfruttando TimThumb e la funzione catch_that_image().
Se non necessitate di un’immagine di anteprima allora potete eliminare la riga 6, caricare il file nella cartella del template e iniziare a usufruire di YARPP.

Se invece desiderate mostrare l’immagine di anteprima del post aggiungete al file function.php la seguente funzione:

function catch_that_image() {
	global $post, $posts;
	$first_img = "";
	ob_start();
	ob_end_clean();
	$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
	$first_img = $matches [1] [0];

	if(empty($first_img)){ //Definisce un'immagine di default
		$first_img = "/images/default.jpg";
	}
	return $first_img;
}

La funzione restituisce l’url della prima immagine presente nel post e se mancante quello dell’immagine di default impostata. L’immagine restituita ovviamente avrà le sue dimensioni originali, per adattarla al meglio nella grandezza desiderata possiamo sfruttare TimThumb, uno script in grado di ridimensionare le immagini.
Scaricate l’ultima versione dello script, create la cartella scripts nella cartella del vostro template, al suo interno piazzate il file timthumb.php e create la cartella cache (quante ripetizioni di cartella!). Assicuratevi che la cartella cache abbia i permessi settati a 775 (se non riuscite a visualizzare le immagini provate 755).

A questo punto dovreste avere tutto il necessario per visualizzare i related posts con tanto di immagine di anteprima, vi basta solo lavorare sul CSS e impostare i parametri di timthumb e per questo vi rimando a questo articolo.

Autore: Fabio Di Stasio

Web Designer Freelance specializzato in sviluppo web, realizzazione di template responsive, creazione di temi e plugin WordPress e purista degli standard W3C.