Aggiungere articoli correlati

Aggiungere articoli correlati senza plugin a fine articolo.

Aggiungere articoli correlati nel nostro sito? Ti interessa? Vedremo come implementare questa funzionalità senza l’utilizzo dei plugin.

Aggiungere articoli correlati è molto importanti perché porta  benefici a livello di ranking, infatti, aiuta a diminuire la frequenza di rimbalzo, un parametro che Google  tiene in considerazione.

Inoltre, avendo la funzionalità degli articoli correlati l’utente interessato che ha letto un tuo articolo può essere interessato ad approfondire un argomento e avrà la possibilità di muoversi tra le pagine del sito.

Come ridurre la frequenza di rimbalzo (bounce-rate) del tuo sito web.

Aggiungere articoli correlati

Per WordPress esistono diversi plugin che ti aiutano ad aggiungere articoli correlati senza minimo sforzo, ma questo posto non ha lo scopo di farti installare l’ennesimo plugin con tutti gli svantaggi che sicuramente conoscerai.

L’uso eccessivo di plugin in un sito, si sa, può intasare il tuo blog WordPress o peggio ancora impedirne la corretta visualizzazione a causa di incompatibilità. Per non incorrere in questi problemi, cerchiamo di usarne il meno possibile e in alternativa, apportiamo direttamente le nostre modifiche al codice del sito.

Ovviamente possiamo ottenere lo stesso risultano anche senza plugin, digitando pochissime righe di codice php. In questo articolo vedremo come mostrare i post correlati a fine articolo su WordPress senza plugin.

Se stiamo lavorando su un tema sviluppato da altri, dobbiamo operare necessariamente all’interno di un child theme. In questo modo eviteremo che al primo aggiornamento le nostre modifiche siano annullate.

Tema Child WordPress perché crearlo?

 

Aggiungere articoli correlati. Ecco il codice

Iniziamo aggiungendo questo codice al file functions.php del tema child, che ci consente di visualizzare la thumbnail dell’articolo:

add_theme_support( 'post-thumbnails' );

Puoi accedere al file functions.php all’interno del editor di WordPress in Aspetto-> editor e seleziona il tema child e il file.

Procediamo aggiungendo questo codice nel file single.php nel punto in cui desideriamo che vengano visualizzati gli articoli correlati, nella pagina di ogni singolo post:


<div class="relatedposts">
<h3>Related posts</h3>
<?php
$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);

if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=>4, // Number of related posts to display.
'caller_get_posts'=>1
);

$my_query = new wp_query( $args );

while( $my_query->have_posts() ) {
$my_query->the_post();
?>

<div class="relatedthumb">
<a rel="external" href="<? the_permalink()?>"><?php the_post_thumbnail(array(150,100)); ?>
<?php the_title(); ?>
</a>
</div>

<? }
}
$post = $orig_post;
wp_reset_query();
?>
</div>

La parte di codice the_post_thumbnail(array(150,100) imposta la dimensione di visualizzazione dell’immagine di anteprima (thumbnail), in questo caso 150px width, 100px height.

Aggiungere articoli correlati con un’pò di stile

Supponendo che la larghezza dell’articolo sia di 640px, il codice css che dovremo aggiungere allo stile del sito, è il seguente:


.relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}
.relatedposts h3 {font-size: 20px; margin: 0 0 5px 0; }
.relatedthumb {margin: 0 1px 0 1px; float: left; }
.relatedthumb img {margin: 0 0 3px 0; padding: 0;}
.relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px; width: 150px;}
.relatedthumb a:hover {background-color: #ddd; color: #000;}

 

Questo codice ti consente di avere 4 immagini di anteprima per riempire la larghezza di 640 px (margini inclusi).

 

Conclusione

Abbiamo appena visto come aggiungere articoli correlati a fine articolo in WordPress. Se hai difficoltà scrivimi nei commenti 🙂

 

Autore Bartolomeo

Mi chiamo Bartolomeo Alberico, sono un consulente tecnico con la passione per il web e la tecnologia e tutto quello che le ronza intorno.
Nel tempo libero scrivo articoli per il mio blog su argomenti vari, in particolare su WordPress e SEO.

Condividi questo articolo!

2 Commenti

Massimiliano Rispondi

Non mi funziona… vedo solo il titolo, ma nessun post… come mai?

Bartolomeo Rispondi

Non mi risulta che non funziona,che tema utilizzi? E’vero che lo scrissi tempo fa però, ora ricontrollo forse non sarà più compatibile.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.

Ho letto la policy privacy e accetto il trattamento dei miei dati personali in conformità al D.Lgs. 196/2003