Tout savoir sur WordPress

Afficher une estimation du temps de lecture d’un article

Afin d’améliorer l’expérience utilisateur de vos lecteurs, cette astuce vous montre comment ajouter une estimation du temps de lecture d’un article.

Aujourd’hui, j’aimerais partager une astuce que je trouve intéressante en terme d’UX. Il s’agit d’afficher une estimation du temps de lecture de votre article. Si votre article est trop long, les lecteurs pourront décider de le mettre en favori afin de revenir le lire plus tard. Cela permettra d’améliorer l’expérience utilisateurs auprès de vos lecteurs.

Voici le code à ajouter dans votre fichier functions.php :

add_filter('the_content', 'jm_estimated_time_to_read_post');
function jm_estimated_time_to_read_post( $content ) {
	
    if ( is_single() ) {
		
	// je compte le nombre de mots dans mon article
	$wordCount = str_word_count( $content );
		
	// Je multiplie par 1/60 (car je veux un résultat en minutes) 
	// en considérant qu'un lecteur met au maximum 1 seconde à lire un mot. 			
	// J'arrondis le tout à l'unité.
	$time_to_read = round($wordCount * ( 1/60 ) );   
		
	$content = '<span class="estimated-time">Temps estimé pour la lecture de cet article : ' . $time_to_read . ' min</span>' . $content;
    }
	
    return $content;
}
Cet article a été mis à jour il y a 4221 jours - Il n'est peut être plus à jour !

Article écrit par jmlapam

26 Commentaires

  1. Merci pour cette astuce.
    Mais il manque un ) dans le codage à la fin de
    $time_to_read = round($wordCount * (1/60 ));
    Je l’ai mis en gras pour que tu vois celui qui manque.

  2. Bonne idée, mais il y a un hic : str_word_count va compter les mots, en prenant en compte les balises html et tout le toutim. Je rajouterais donc bien un strip_tags pour un peu plus de fiabilité, et à ne pas utiliser sur des articles majaoritairement visuels bien entendu (images ou vidéos…)

  3. @Dominique : Merci pour la remarque, j’ai mis à jour le code ;)

    @Tilap : Pas faux cette histoire de strip_tags ! Après on peut toujours adapté le code en fonction de ses besoins.

    Au passage, merci jmlapam pour cette astuce :)

  4. @dominique : on peut aussi ne pas mettre de parenthèse du tout, y a pas de priorité entre division et multiplication, enfin si je ne dis pas de bêtise.
    @tiltop: excellent ! C’est vraiment une bonne remarque. Merci.
    @jonathan : je t’en prie :)

  5. @julio : salut, en effet la fonction présentée ici est d’ordre {très} général. Perso, j’ai plein de conditions rajoutées sur mes blogs. Merci de ta précision pour les custom post types. Cela servira à pas mal de monde je pense. :)

  6. J’aime bien cette idée, perso, je pense mettre 0.35 sec par mot. Essaie de lire ton article en ne lisant que 1 mot par seconde, moi j’y arrive pas, mon cerveau tente un suicide mental !
    Bref ;)
    Je vais l’utiliser mais (comme d’hab) je vais la modifier, car je ne souhaite pas que le contenu de mes articles Portfolio (un Custom Post Type “portfolio”) affiche un temps de lecture, ce n’est pas cohérent. En fait, même sur les pages je ne veux pas le compteur. Par contre, sur mon autre CPT “audits” je le veux !
    Je remplace alors “is_single()” par “is_singular( array( ‘posts’, ‘audits’ ) )”, de ce fait, seuls ces 2 CPTs auront ce compteur de temps !
    Merci à vous !

  7. @Julio : Tu pourras nous faire un topo des améliorations ?

    Je pense qu’1 sec par mot ça fait beaucoup (0.5 ?)

    Présenter le temps aux lecteurs ne risque t’il pas de les faire fuir car si ils apprécient l’article et tant qu’ils ne sont pas sous la ligne de flottaison, tu ne peux que les tenir en haleine.

    Le temps n’est plus un obstacle…

    C’est comme lire un bon roman, on se moque un peu de la durée puisque l’on kiff le récit ! C’est mon avis.

  8. Les modifs sont dans mon commentaire déjà, rien de plus à ajouter cher ami.
    Je remplace alors « is_single() » par « is_singular( array( ‘posts’, ‘audits’ ) ) », de ce fait, seuls ces 2 CPTs auront ce compteur de temps !

  9. @rodrigue : l’UX est une affaire de choix. Si tu penses que tes lecteurs n’en n’ont pas besoin voire que cela pourrait nuire à ton trafic, ne l’utilise pas. L’idée ici est de permettre au lecteur de gérer son temps parmi la grosse dizaine de blogs qu’ils consultent chaque jour.

  10. Oui je conçois en fonction de la cible l’intérêt de cette fonction, dans ce cas ce serait intéressant d’analyser et pouvoir comparer, et savoir si vraiment ça apporte un + car seules les stats peuvent confirmer cela.

  11. @rodrigue: les stats c’est une chose (essentielle je te l’accorde) mais il n’y a pas que cela, l’estime de tes lecteurs échappe parfois à analytics si tu veux. Donc le principe c’est aussi que le lecteur se dise :”ah tiens lui il réfléchit POUR MOI” et pas que pour ses pubs ou autres.

  12. Oui bien sûr, perso les stats je m’en balance, l’histoire du taux de rebond etc on pourrai en discuter des heures, d’ailleurs Laurent B. viens d’en faire un article il me semble, mais si tes infos sont pertinentes ton lecteur ne peux que s’en satisfaire ^^ quel que soit le temps passé (ça peux vite devenir glissant comme sujet ;-). J’aurai juste aimé pouvoir comparer les résultats à l’utilisation de l’UX. Merci pour ton point de vue qui je te l’accorde dépends encore une fois de ta stratégie communication ^^.

  13. Bonjour,

    Est-il possible d’insérer ce code directement dans la catégorie ou le type de post choisit ?

    Cordialement

  14. Comme lecteur, cette astuce m’agace. Je ne veux plus accorder de l’importance au temps mais au contenu de l’article sinon je me sens un peu stressée. Aussi, la lecture diffère d’une personne à une autre. Aussi, la lecture diffère en elle-même. On peut trouver la lecture rapide, moyenne, lente et cela selon la facilité de l’article ainsi que la disponibilité en temps du lecteur.

  15. Au delà du code, merci pour l’idée!
    Contrairement à véronique je trouve que c’est extrèmement positif pour un lecteur!

    Sur un site avec des visiteurs inscrits, on pourrait même aller jusqu’à faire une estimation individuelle du temps de lecture pour être plus pertinent…

  16. Merci beaucoup pour l’idée, je vais ajouter deux petite astuces dans ce code.

    Une petite modification dans le cas ou l’article est long et ou la lecture dépasserais les 60 minutes, en effet afficher 92 min n’est pas jolie.

    Il suffit de rajouter après “$time_to_read = round($wordCount * ( 0.5/60 ) );”

    if ( $time_to_read > 60 ) {
    $time_to_read = strftime( "%H heure et %M", $time_to_read * 60 ); // On formate en heure/minutes si plus de 60 minutes
    }
    

    Et une seconde si vous ne souhaitez pas afficher ce message pour les articles d’une catégorie en particulier (exemple: les articles qui présentent des vidéos), il suffit de modifier le “if ( is_single() ) {” :

    if ( is_single() AND !in_category( '11' ) ) { // L'information ne s'affichera pas pour la catégorie 11
    

    Voilou

  17. Merci pour l’astuce, c’est une bonne idée d’afficher le temps estimé pour les articles, mais aussi pour les newsletters je pense.
    Par contre, si le temps de lecture est très long et que je veux une information rapidement, je pense que je vais avoir tendance à quitter le blog et à aller chercher l’information ailleurs…
    Il faudrait faire des tests pour voir sur les articles longs.

  18. Bonjour,
    Ce code m’intéresse beaucoup, mais était-il possible de déterminer l’emplacement de la phrase ?
    JE voudrais que cela apparaissent en haut à la hauteur Auteur – Date – Nombre de lus

    Merci

    • @noaneo: Avec ce code, le temps de lecture s’affichera au-dessus du contenu.