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: ecco come crearlo in 1 click.

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 🙂

• Installare VMware Workstation su Ubuntu 18.04. Tutti i passaggi da seguire.
• Huawei P20 Pro: scheda tecnica, caratteristiche e prezzo.
• Aggiornamento Ubuntu 19.04 Disco Dingo. Ecco come procedere
• Rubare password WiFi con Fluxion di Kali Linux 2019.4. Ecco come fare.
• Installare software senza privilegi di amministratore su Windows 11