Comment mettre en évidence les nouveaux articles pour les visiteurs récurrents dans WordPress

Vos visiteurs récurrents sont votre public le plus précieux. Ils ont déjà montré de l'intérêt pour votre contenu et reviennent pour en savoir plus.

Mais voici le truc : lorsqu'ils arrivent sur votre page d'accueil, ils recherchent une chose spécifique : ce qui est nouveau depuis leur dernière visite.

La bonne nouvelle, c'est que mettre en avant les nouveaux articles pour les visiteurs récurrents est plus facile que vous ne le pensez, et cela fait une réelle différence.

Nous avons testé diverses méthodes sur des dizaines de sites WordPress et avons trouvé 2 approches qui fonctionnent à merveille. Dans ce guide, nous vous présenterons les moyens les plus efficaces de mettre en avant les nouveaux articles pour les visiteurs récurrents.

Pourquoi mettre en avant les nouveaux articles sur votre site WordPress ?

Mettre en avant les nouveaux articles sur votre site WordPress aide les visiteurs récurrents à découvrir facilement votre nouveau contenu. Ainsi, ils ne manqueront aucune information fraîche ou mise à jour que vous avez ajoutée à votre blog.

Étiqueter les nouveaux articles améliore l'expérience utilisateur sur votre site WordPress. Lorsqu'un visiteur récurrent arrive sur votre site, il peut facilement repérer les articles qu'il n'a pas encore lus, ce qui lui fait gagner beaucoup de temps et augmente vos vues de page.

Une bonne expérience utilisateur sur votre site aide non seulement à attirer les visiteurs récurrents, mais contribue également au SEO WordPress. Lorsque votre site est facile à utiliser, cela améliore votre classement dans les moteurs de recherche et augmente la probabilité que les visiteurs trouvent votre contenu.

Dans cet esprit, voyons comment vous pouvez mettre en avant les nouveaux articles pour les visiteurs récurrents dans WordPress.

Nous vous montrerons deux méthodes : une avec un plugin WordPress et l'autre avec du code. Vous pouvez accéder à une méthode spécifique en utilisant les liens rapides ci-dessous :

• Méthode 1 : Mettre en évidence les nouveaux articles WordPress avec un plugin WordPress
• Méthode 2 : Mettre en évidence les nouveaux articles en ajoutant du code personnalisé
• Découvrez d'autres façons d'optimiser votre blog WordPress
• FAQ : Mettre en évidence les nouveaux articles pour les visiteurs récurrents

Méthode 1 : Mettre en évidence les nouveaux articles WordPress avec un plugin WordPress

Cette première méthode utilise le plugin Mark New Posts. Nous le recommandons aux blogueurs débutants car il est très simple. Ce plugin ajoutera une étiquette pour montrer quels articles de blog dans WordPress que vos visiteurs n'ont pas encore vus.

Tout d'abord, vous devez installer et activer le plugin Mark New Posts. Si vous avez besoin d'aide, consultez notre guide étape par étape sur comment installer des plugins WordPress.

Après cela, allez dans Paramètres » Mark New Posts depuis la zone d'administration WordPress. Vous verrez maintenant la page des paramètres du plugin.

Ce que vous voulez faire maintenant, c'est sélectionner où afficher l'étiquette « Nouveau ». Vous pouvez sélectionner Après le titre de l'article, Avant le titre de l'article, ou Avant et après le titre de l'article.

Nous trouvons que l'ajout de l'étiquette après le titre de l'article ressemble le plus à une notification et attire le plus l'attention des utilisateurs, c'est donc ce que nous avons choisi.

Ensuite, vous devez choisir l'apparence du marqueur dans le paramètre Type de marqueur. Les options incluent le texte « Nouveau », le texte « Nouveau » hérité, le cercle orange, le drapeau, l'image ou Aucun.

Assurez-vous d'explorer chaque option pour voir celle qui s'intègre le mieux à la conception de votre site Web.

Un autre paramètre que vous pouvez configurer est la couleur d'arrière-plan du titre du nouvel article. Si vous activez cette option, lorsqu'un lecteur visite un nouvel article, il verra que la section du titre de l'article a une couleur d'arrière-plan. Nous n'avons pas trouvé ce paramètre nécessaire, nous l'avons donc désactivé.

Dans le paramètre « Considérer un article comme lu », vous pouvez choisir quand désactiver l'étiquette du nouvel article : après son ouverture, après son affichage dans la liste, ou après l'ouverture de n'importe quelle page Web du blog.

Nous suggérons d'opter pour « après son ouverture ». Cela signifie que si un visiteur n'a pas lu plusieurs articles et en ouvre un, l'étiquette de nouvel article pour les autres articles ne disparaîtra pas.

Ensuite, vous pouvez sélectionner le nombre de jours pendant lesquels l'article restera mis en évidence comme nouveau, afficher tous les articles existants comme nouveaux pour les nouveaux visiteurs et désactiver l'étiquette de nouveauté pour les types d'articles personnalisés.

Les deux derniers réglages sont assez avancés.

L'un est « Autoriser en dehors de la liste des articles », ce qui signifie que vous pouvez mettre en évidence des articles en dehors de la boucle, comme dans les zones de barre latérale prêtes pour les widgets. Soyez prudent lorsque vous activez ce paramètre, car il peut créer des erreurs WordPress indésirables.

L'autre est « Utiliser JavaScript pour afficher les marqueurs », ce qui est seulement recommandé si le plugin n'est pas compatible avec le thème ou d'autres plugins utilisés sur votre blog. Dans la plupart des cas, vous voudrez garder ce paramètre désactivé.

Une fois que vous avez terminé de configurer les paramètres du plugin, cliquez simplement sur « Enregistrer ».

Et voilà ! Allez visiter votre site web en mode incognito pour voir si les nouvelles étiquettes pour les articles récents sont en ligne.

Voici à quoi cela ressemble sur notre site de démonstration :

Méthode 2 : Mettre en évidence les nouveaux articles en ajoutant du code personnalisé

Vous n'êtes pas satisfait des options d'étiquette de nouvel article proposées par le plugin précédent ? Si c'est le cas, vous pouvez mettre en évidence les nouveaux articles en utilisant du code personnalisé à la place.

Pour les débutants, cette méthode peut sembler intimidante. Mais ne vous inquiétez pas, car nous utiliserons le plugin WPCode pour insérer en toute sécurité des extraits de code dans WordPress sans casser votre site web.

WPCode facilite également la gestion de plusieurs extraits de code personnalisés, ce qui sera utile dans notre cas puisque nous en utiliserons plus d'un.

Nous avons testé cet outil en profondeur dans notre environnement de démonstration et avons constaté que c'est le moyen le plus fiable d'ajouter du code personnalisé.

Pour en savoir plus sur notre expérience, vous pouvez consulter notre avis sur WPCode.

La première chose à faire est d'installer WPCode dans WordPress. Pour les instructions de configuration, consultez notre article sur comment installer un plugin WordPress.

Une fois le plugin activé, allez dans Extraits de code » + Ajouter un extrait depuis votre tableau de bord WordPress.

À partir de là, trouvez « Ajouter votre code personnalisé (Nouvel extrait) » et cliquez sur le bouton « + Ajouter un extrait personnalisé » en dessous.

Ensuite, sélectionnez « Extrait PHP » comme type de code dans la liste des options qui apparaissent à l'écran.

Maintenant, ajoutons un titre à votre extrait de code afin qu'il soit plus facile à retrouver plus tard si nécessaire.

Pour cela, vous pouvez le nommer quelque chose comme « Modificateur de titre de publication WordPress de la dernière visite ».

Après cela, vous pouvez copier et coller l'extrait de code ci-dessous :

// Define a function to modify post titles based on the last visit
function wpb_lastvisit_the_title($title, $id) {

    // Check if not in the loop, a singular page, or a page post type; if true, return the original title
    if (!in_the_loop() || is_singular() || get_post_type($id) == 'page') return $title;

    // Check if no 'lastvisit' cookie is set or if it is empty; if true, set the cookie with the current timestamp
    if (!isset($_COOKIE['lastvisit']) || $_COOKIE['lastvisit'] == '') {
        $current = current_time('timestamp', 1);
        setcookie('lastvisit', $current, time() + 60 * 60 * 24 * 7, COOKIEPATH, COOKIE_DOMAIN);
    }

    // Retrieve the 'lastvisit' cookie value
    $lastvisit = $_COOKIE['lastvisit'];

    // Get the publish date of the post (in Unix timestamp format)
    $publish_date = get_post_time('U', true, $id);

    // If the post was published after the last visit, append a new span to the title
    if ($publish_date > $lastvisit) $title .= '<span class="new-article">New</span>';

    // Return the modified or original title
    return $title;
}

// Add a filter to apply the 'wpb_lastvisit_the_title' function to 'the_title' hook with priority 10 and 2 parameters
add_filter('the_title', 'wpb_lastvisit_the_title', 10, 2);

Ce que fait cet extrait, c'est modifier les titres des articles WordPress en fonction de la dernière visite d'un utilisateur.

Il vérifie si la page est un article de blog ou non, et si ce n'est pas le cas, il affichera le titre original tel quel. Mais s'il s'agit d'un article de blog, le titre sera modifié.

Ensuite, l'extrait s'assure que le cookie lastvisit existe. S'il n'existe pas, le code le crée et le définit à l'heure actuelle. La fonction compare ensuite cette heure lastvisit avec la date de publication de l'article et ajoute une étiquette « Nouveau » au titre si l'article est plus récent que la dernière visite.

Une fois que vous avez inséré l'extrait de code, faites simplement défiler vers le bas et sélectionnez « Insertion automatique » pour la méthode d'insertion.

En dehors de cela, assurez-vous de choisir « Frontend uniquement » pour l'emplacement. Cela signifie que le code ne s'exécutera que sur la partie de votre blog WordPress avec laquelle les visiteurs interagissent et non dans votre panneau d'administration ou d'autres endroits.

Une fois cela fait, vous pouvez rendre le code « Actif » et cliquer sur « Enregistrer le snippet ».

Répétez maintenant l'étape pour ajouter un nouveau snippet de code personnalisé. Cette fois, le code stylisera l'étiquette « Nouveau » qui est ajoutée aux titres des articles récents en fonction de la dernière visite d'un utilisateur.

Vous pouvez donc le nommer quelque chose comme « Style de l'étiquette Nouveau pour les titres d'articles » et le type de code doit être « Snippet CSS ».

Vous pouvez ensuite copier et coller les lignes de code suivantes dans la boîte d'aperçu du code :

/* CSS to style the "New" label in blog post titles */
.new-article {
    background-color: #4CAF50; /* Green background color */
    color: #ffffff; /* White text color */
    padding: 2px 5px; /* Padding around the label */
    margin-left: 5px; /* Adjust the margin to your preference */
    border-radius: 3px; /* Rounded corners for the label */
    font-size: 12px; /* Adjust the font size to your preference */
}

Ce snippet de code personnalise essentiellement l'étiquette d'article « Nouveau » en utilisant une couleur d'arrière-plan personnalisée, une couleur de texte, des marges, des remplissages, un rayon de bordure et une taille de police.

N'hésitez pas à ajuster ces éléments selon vos préférences au fur et à mesure. Assurez-vous simplement d'utiliser des codes couleur hexadécimaux ou des valeurs RVB pour les couleurs d'arrière-plan et de texte.

Dans la section Insertion, sélectionnez « En-tête de tout le site » comme emplacement. Après cela, rendez le code « Actif » et cliquez sur « Enregistrer le snippet ».

Et voilà ! Pour voir si le code fonctionne, vous pouvez publier un nouvel article de blog et voir l'article sur mobile ou sur ordinateur en mode incognito.

Si le code est réussi, vous devriez voir une étiquette « Nouveau » à côté des titres de vos articles récents.

Découvrez d'autres façons d'optimiser votre blog WordPress

En plus de mettre en avant les articles vedettes pour les visiteurs récurrents du site, il existe d'autres moyens d'améliorer votre blog et d'inciter les gens à rester plus longtemps sur votre site.

Par exemple, vous pourriez afficher des articles similaires à celui que le visiteur est en train de lire. De cette façon, vous pouvez les maintenir engagés en leur présentant du contenu qui correspond à leurs intérêts.

Ou, vous pourriez créer une barre de pied de page flottante et collante pour capturer des adresses e-mail ou promouvoir des offres spéciales. Cette barre reste visible pendant que les visiteurs font défiler la page. Vous pouvez l'utiliser pour rappeler constamment de s'abonner ou de profiter de votre offre, augmentant ainsi les taux de conversion.

Vous pourriez également vouloir ajouter un redimensionneur de police à des fins d'accessibilité. Cela permet aux visiteurs d'ajuster la taille de la police sur votre site Web selon leurs préférences, ce qui leur facilite la lecture de votre contenu.

Si vous avez beaucoup de contenu de blog, vous pourriez vouloir créer des pages personnalisées qui affichent des articles de blog s'ils ont un champ personnalisé spécifique.

Disons que vous avez un champ personnalisé pour « Difficulté de la recette ». Vous pourriez créer une page qui affiche tous les articles de blog étiquetés « Recette » et qui ont également la valeur du champ personnalisé « Facile ».

De cette façon, les visiteurs à la recherche de recettes faciles peuvent toutes les trouver au même endroit.

Voici d'autres conseils que vous pouvez consulter pour optimiser davantage votre blog WordPress :

• Comment afficher les dates relatives dans WordPress
• Comment créer une barre de défilement personnalisée dans WordPress
• Comment afficher les extraits d'articles dans les thèmes WordPress
• Comment créer un site WordPress adapté aux mobiles (Conseils d'experts)
• Comment surligner du texte dans WordPress (Guide pour débutants)
• Comment ajouter une barre de progression de lecture dans les articles WordPress

FAQ : Mettre en évidence les nouveaux articles pour les visiteurs récurrents

Voici quelques questions fréquemment posées par nos lecteurs concernant la mise en évidence des nouveaux articles pour les visiteurs récurrents dans WordPress :

Combien de temps un article doit-il rester marqué comme « nouveau » pour les visiteurs récurrents ?

Cela dépend de la fréquence à laquelle vous publiez du contenu et de la fréquence à laquelle les utilisateurs reviennent sur votre site. Une bonne règle générale est de mettre en évidence les articles comme « nouveaux » pendant :

• 7 jours après la publication
• Ou jusqu'à ce que le visiteur consulte l'article

Vous pouvez personnaliser la durée en utilisant du code ou les paramètres d'un plugin. Assurez-vous simplement de ne pas conserver le label « nouveau » indéfiniment — cela va à l'encontre de l'objectif et peut confondre les visiteurs.

Envisagez d'afficher un badge subtil ou une animation pour que cela reste convivial.

L'utilisation de cookies pour mettre en évidence les nouveaux articles affectera-t-elle les performances du site ?

Non, l'utilisation de cookies pour mettre en évidence les nouveaux articles pour les visiteurs récurrents a généralement un impact minimal sur les performances. Les cookies sont stockés dans le navigateur de l'utilisateur et envoyés avec les requêtes, ils ne chargent donc pas davantage votre serveur.

Pour que les choses restent efficaces :

• Stockez uniquement les données nécessaires (par exemple, un seul horodatage).
• Utilisez du JavaScript léger et un minimum de CSS.
• Évitez d'appliquer une logique à chaque page si elle n'est nécessaire que sur la page du blog ou d'archive.

Si vous vous souciez de l'optimisation, associez-la à un plugin de mise en cache qui prend en charge le contenu dynamique, tel que WP Rocket.

Puis-je mettre en évidence les nouveaux articles uniquement pour les utilisateurs connectés ?

Oui, si votre site exige que les utilisateurs se connectent (comme un site de membre ou communautaire), vous pouvez mettre en évidence les nouveaux articles en fonction de leur dernière heure de connexion.

WordPress stocke la dernière connexion de chaque utilisateur sous forme de métadonnées, que vous pouvez récupérer en utilisant :

$last_login = get_user_meta(get_current_user_id(), 'last_login', true);

Vous pouvez ensuite comparer cette valeur à la date de publication de vos articles.

Cette méthode est plus fiable que les cookies, car elle ne dépend pas du navigateur de l'utilisateur. Elle est particulièrement utile pour les tableaux de bord des membres ou les portails d'apprentissage où le contenu est mis à jour régulièrement.

Nous espérons que cet article vous a aidé à apprendre comment mettre en évidence les nouveaux articles pour les visiteurs récurrents dans WordPress. Vous voudrez peut-être aussi consulter notre sélection d'experts des meilleurs plugins de constructeurs de pages WordPress glisser-déposer et notre guide complet des éléments de conception de site Web WordPress les plus efficaces.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.