Cliquez sur la photo pour l’agrandir
Introduction
De nos jours, sollicité de toutes parts, le lecteur moyen possède une durée d’attention très limitée.
Voilà pourquoi la personne habituée à lire sur l’internet des textes qui ne dépassent pas 280 caractères sera rebutée par de longues dissertations comme celles publiées sur ce blogue.
D’où l’idée d’afficher, dès le début d’un texte, le temps nécessaire pour le lire. Comme pour dire : ‘Oui, je sais, ça parait long. Mais vois-tu, ça ne te prendra que quelques minutes de ton temps.’
Pour y parvenir, il y a deux grandes étapes. Premièrement, il faut doter le blogue de la capacité de calculer le temps de lecture. Une fois qu’il en est apte, il faut déterminer l’endroit où on veut que ce temps de lecture soit affiché.
Avant d’aller plus loin, il est recommandé d’effectuer une sauvegarde du blogue puisque la moindre erreur pourrait le rendre inopérant.
De plus, n’ajoutez pas de code en l’écrivant vous-mêmes; vous risqueriez de vous tromper. Ajoutez-le par copier-coller seulement.
Modifier la machine logicielle
Le fichier functions.php est en réalité le code d’un programme informatique. Il est un élément important de la machine logicielle qui permet au blogue de fonctionner. Pour doter le blogue du pouvoir de calculer le temps de lecture, il faut lui ajouter le code nécessaire.
Pour cela, il faut accéder au blogue à titre d’administrateur.
Cliquez sur la photo pour l’agrandir
Dans le panneau de gauche, lorsque le curseur de la souris survole l’item Apparence, un panneau latéral s’ouvre; cliquez sur le sous-item Éditeur de fichiers des thèmes.
Cliquez sur la photo pour l’agrandir
Par défaut, à l’ouverture, l’éditeur affichera le code du fichier style.css. N’y touchez pas.
Dans la liste des fichiers affichée à droite, cliquez sur functions.php. Aussitôt, l’éditeur affichera son code. De plus, près du coin supérieur gauche de l’écran, le nom de ce fichier (functions.php) sera affiché (ici en rouge) : cela vous indique que vous modifiez bien le bon logiciel.
Quelque part dans ce code, vous trouverez le texte :
/**
* Enqueue scripts and styles
*/
Cliquez immédiatement à droite de ce ‘*/’ et appuyez sur ‘Enter’ afin de créer une nouvelle ligne. Puis copiez le code ci-dessous et collez-le à la ligne vide que vous venez de créer.
function TempsDeLecture() {
$article = get_post_field( 'post_content', $post->ID ); //lire le texte
$NombreDeMots = str_word_count( strip_tags( $article ) ); //lui retirer les balises html
$Temps = ceil($NombreDeMots / 200); //diviser le nombre de mots entiers par une vitesse de lecture de 200 mots par minute
if ($Temps == 1) { //ajouter le pluriel si besoin
$label = " minute";
} else {
$label = " minutes";
}
$NombreDeMinutes = $Temps . $label; //formater le résultat
return $NombreDeMinutes;
}
Le lecteur moyen lit entre 180 et 230 mots à la minute tandis qu’un lecteur chevronné peut lire jusqu’à 350 mots à la minute. Ici, le code suggéré se base sur une vitesse de lecture de deux-cents mots à la minute.
Une fois le code ajouté, appuyez sur le bouton Mettre à jour le fichier.
L’affichage du temps de lecture
Sous WordPress, l’affichage des articles est déterminé par deux programmes informatiques. Le fichier index.php détermine l’affichage des textes lorsqu’ils se suivent à la queue leu leu. Lorsqu’un seul texte est affiché à l’écran, c’est de programme single.php qui détermine sa présentation.
Dans un cas comme dans l’autre, une seule ligne de code sera nécessaire. Toutefois, il faut l’ajouter très précisément, au bon endroit.
Cliquez sur la photo pour l’agrandir
Pendant que nous sommes toujours sous l’éditeur de code, dans la liste des fichiers affichée à la droite de l’écran, cliquez sur single.php. Son code apparait aussitôt.
Parmi les premières lignes de code, trouvez celle-ci :
<h2><?php the_title(); ?></h2>
Immédiatement après, ajoutez une ligne vide et collez-y le texte suivant :
<small>Publié le <?php the_time(get_option('date_format')) ?> | Temps de lecture : <?php echo TempsDeLecture(); ?></small><br />
Ici, nous avons fait une pierre deux coup. À gauche du temps de lecture (obtenu grâce au code ajouté à la machine logicielle du blogue), nous avons également précisé la date de publication grâce à une fonction qui s’y trouvait déjà.
Une fois cette ligne de code ajoutée, finalisez le tout en cliquant sur le bouton ‘Mettre à jour le fichier’.
Pour ajouter la même chose aux articles lorsqu’ils s’affichent à la queue leu leu, la ligne de code à ajouter est identique.
Cliquez sur la photo pour l’agrandir
Toujours sous l’éditeur de code, dans la liste des fichiers affichée à la droite de l’écran, cliquez sur index.php. Son code apparait aussitôt.
Parmi les premières lignes de code, trouvez celle-ci :
<h2><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2>
À sa suite, ajoutez la ligne suivante…
<small>Publié le <?php the_time(get_option('date_format')) ?> | Temps de lecture : <?php echo TempsDeLecture(); ?></small><br />
…puis cliquez sur le bouton ‘Mettre à jour le fichier’.
Voilà !
Écrit par Jean-Pierre Martel