Tutoriel : améliorer le “lire la suite” de WordPress

En commentaire de mon article précédent, Guillaume m’a posé quelques questions à propos du lien “Read More” qui est présent en page d’accueil de la plupart des thèmes WordPress, pour faire le lien avec les pages d’articles.

Essayons donc dans cet article d’améliorer ce lien, pour pouvoir y apporter le style que vous souhaitez, ou bien y ajouter des éléments.

Un nouveau filtre a fait son apparition avec la sortie de WordPress 2.7.1, permettant de modifier facilement le lien “read more”, qui vient s’ajouter lorsque vous insérez la balise “More” dans un article.

Ce filtre, c’est the_content_more_link. Nous allons voir plus bas comment nous en servir.

Modifier le texte du lien “Read More”

Si vous souhaitez simplement modifier le texte de ce lien, deux solutions sont possibles:

• L’ajout de votre texte article par article à l’intérieur même de la balise more.
• L’ajout dans le code de votre thème du texte que vous souhaitez voir apparaître.

La première solution est très simple : dans votre éditeur de texte, passez en mode HTML, puis insérez votre code au sein même de la fonction:

<!--more Vous voulez en savoir plus ?-->

Et voilà : votre texte est modifié. Bien sûr, il vous faudra répéter l’opération à chaque fois que vous souhaitez modifier ce texte, article par article.

Mais si vous souhaitez le faire une fois pour toutes, il vous suffit d’ouvrir votre fichier index.php, et de modifier la fonction the_content, comme cela :

<?php the_content( 'Vous voulez en savoir plus ?' ); ?>

Le texte de votre lien “Read More” sera maintenant modifié pour tous vos articles.

Empêcher le saut automatique a l’ouverture des pages articles

Par défaut, lorsque vous cliquez sur un de ces liens, la page qui s’ouvre a une URL particulière, puisqu’à la fin de celle-ci est rajoutée la balise #more plus l’id de l’article en lui-même. Ainsi votre page se charge directement sous l’introduction, permettant au lecteur de continuer sa lecture aisément. Seulement ce saut dans la page n’est peut être pas de votre goût. Pas de problème, un simple ajout dans votre fichier functions.php devrait régler le problème :

<?php
// Empêcher le saut automatique a l'ouverture des pages articles
function werewp_remove_jump($link) {
	$offset = strpos( $link, '#more-' );
	if ( $offset ) {
	    $end = strpos( $link, '"',$offset );
	}
	if ( $end ) {
	    $link = substr_replace( $link, '', $offset, $end-$offset );
	}
	return $link;
}
add_filter( 'the_content_more_link', 'werewp_remove_jump' );
?>

Source: Codex

Ajouter l’attribut nofollow aux liens “read more”

Dans un thème WordPress classique, l’affichage d’un article sur la page d’accueil est souvent composé des éléments suivants :

• Le titre de l’article, avec un lien pointant vers l’article en lui-même,
• Un extrait du début de l’article,
• Une photo miniature, liant aussi vers l’article,
• Le lien “Lire la suite”, pointant vers l’article.

Comme vous pouvez le voir, cela fait donc 3 liens pointant vers la même source. Si vous souhaitez optimiser votre page pour les moteurs de recherche, vous devriez donc vous pencher sur ces éléments et limiter le nombre de liens sur votre page d’accueil.

Il est donc conseillé d’ajouter l’attribut nofollow sur les liens moins utiles de votre page. Le titre et son lien sont importants, puisque votre titre comporte les mots-clés importants de votre site; le texte “lire la suite” en revanche n’est pas vraiment intéressant, à moins que votre site ne parle de fins de romans pour les impatients :)

Nous allons donc ajouter l’attribut nofollow, avec la fonction suivante, rajoutée à notre fichier functions.php. Cette fonction va remplacer le filtre de WordPress; libre à vous donc d’effectuer les modifications que vous souhaitez; j’ai par exemple retiré la balise #more dont nous parlions plus haut dans cet article, et changé le texte du lien pour “Voulez-vous en savoir plus ?” (trois en un donc :) )

<?php
// Ajouter l'attribut nofollow et retirer la balise #more du lien "read more"
function werewp_custom_morelink() {
    return '<a class="more-link" href="' . get_permalink() . '" rel="nofollow">Voulez-vous en savoir plus ?</a>';
}
add_filter( 'the_content_more_link', 'werewp_custom_morelink' );
?>

Et voilà ! Des questions, des remarques, n’hésitez pas à commenter ! Et si l’article vous a plu, partagez-le ! ;)