Comment afficher les étiquettes sur les articles de votre blog WordPress ?


Sur WordPress, vous pouvez classer vos articles grâce aux étiquettes (appelées « tags » dans la version anglaise).

La plupart des thèmes WordPress affichent les tags par défaut en bas de chaque article. Si ce n’est pas le cas, vous devrez modifier le code de votre thème pour les ajouter.

Rassurez-vous, ce n’est pas si compliqué ! Je vais vous guider pas à pas pour que vous arriviez à le faire facilement.

Afficher les étiquettes sur les articles de son blog WordPress
Afficher les étiquettes sur les articles de son blog WordPress

Où afficher les étiquettes sur WordPress ?

Vous devez d’abord trouver quel fichier de votre thème contrôle l’affichage d’un article. Souvent, c’est le fichier « single.php ». Il va falloir modifier ce fichier :

  • Soit en allant dans le menu Apparence > Éditeur de WordPress et en cliquant sur « single.php » dans la colonne de droite.
  • Soit en allant directement sur votre FTP (là où vous avez installé les fichiers de votre thème), dans le dossier wp-content/theme/nomdevotretheme/.

Je vous conseille de faire une copie de ce fichier avant toute modification. Ainsi, si vous faites une erreur, vous pourrez facilement restaurer la version initiale du fichier.

Repérez ensuite le code suivant :

<?php the_content(); ?>

Il permet à WordPress d’afficher le contenu (« content » en anglais) de votre article. Nous allons placer les tags juste en dessous.

Quel code utiliser pour afficher les tags ?

Vous pouvez partir d’un code très simple comme celui-ci :
<?php the_tags('A', 'B', 'C'); ?>

Le code « the_tags » indique à WordPress qu’il doit afficher les tags. Ensuite, l’intérieur de la parenthèse vous permet de préciser trois paramètres :

  • Le texte qui précède la liste des étiquettes (A) ;
  • Le séparateur entre chaque tag (B) ;
  • Un éventuel texte qui suit la liste des tags (C).

Vous pouvez tout à fait laisser ces champs vides. Le code suivant par exemple affichera « Cet article parle de : » puis la liste des tags séparés par des tirets.
<?php the_tags('Cet article parle de : ', '-', ''); ?>

Attention, si votre texte comporte une apostrophe, cela risque de poser problème puisque chaque élément de la parenthèse se trouve déjà entre apostrophes. Vous devrez alors utiliser un anti-slash avant l’apostrophe de votre texte, par exemple :
<?php the_tags('L\'article parle de : ', '-', ''); ?>

Vous pouvez améliorer ce code très facilement, comme ceci par exemple :

<?php if (has_tag()) { echo the_tags( '<div class="displaytags">Thèmes : ', '&nbsp;', '</div>'); } ?>

Cette version du code comporte :

  • Une condition : « s’il y a des tags (« if has_tag »), alors affiche les tags (« echo the_tags ») ». A l’inverse, si l’article ne comporte aucun mot clé, rien ne s’affichera.
  • Une balise div qui me permet de personnaliser l’affichage des tags : je peux ainsi ajouter la classe « displaytags » que j’ai créée à la feuille de style du thème WordPress (fichier style.css) afin de contrôler l’apparence des tags.

Afficher les étiquettes utilisées

Parfois, on associe une étiquette à un seul article. Elle n’a donc pas vraiment de pertinence pour le visiteur tant qu’il n’y a pas davantage d’articles qui y sont rattachés. Car plus une étiquette est utilisée, plus elle va rassembler une sélection de posts riche et intéressante pour vos lecteurs.

On peut donc choisir de n’afficher les étiquettes que lorsqu’elles sont utilisées un certain nombre de fois. Par exemple, le code ci-dessous permet d’afficher les étiquettes seulement lorsqu’elles sont utilisées plus de 5 fois (vous pouvez remplacer 5 par le chiffre de votre choix). Un bon moyen de garantir une pertinence maximale !

C’est le code que j’utilise actuellement sur No Tuxedo :

<?php
$tags = wp_get_post_tags($post->ID);
if ($tags) {
echo '<div class="displaytags">Thèmes : ';
foreach($tags as $tag) {
if ($tag->count > 5) {
echo '' . $title . '<a href="' . get_term_link( $tag->term_id, 'post_tag' ) . '" title="' . sprintf( __( "%s" ), $tag->name ) . '" ' . '>' . $tag->name.'</a> ';
}
}
echo '</div>';
}
?>

J’espère que cet article vous sera utile ! N’hésitez pas à poursuivre votre lecture en parcourant ces conseils pour bien tirer profit des étiquettes sur votre blog WordPress.

Thèmes : WordPress 

Poster un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Lorsque vous postez un commentaire sur le blog, le nom indiqué dans la case "Prénom" ainsi que votre message apparaîtront publiquement. Votre adresse e-mail restera confidentielle.

10 commentaires sur “Comment afficher les étiquettes sur les articles de votre blog WordPress ?

  • Angy

    Bonjour,
    Merci pour le bout de code, je monte un site qui utilise le theme Divi d’élégant theme. j’ai réussi à faire remonter les étiquettes sur les pages de type article et archive (en mettant le code dans les page ‘index.php’ et ‘single.php’ de mon Child-theme.
    Par contre ça ne fonctionne pas sur ma page d’accueil. cette page (de type page) fait appel au module « Blog » qui remonte les post des diverses catégories.
    Une idée ?
    Merci beaucoup

    Répondre à Angy
    • Marlène

      Hello Angy, je ne connais pas les spécificités du thème… mais une page d’accueil mobilise parfois un autre fichier que index.php. Ça peut être notamment front-page.php dans le cas d’une page statique ou template-(nom).php… ou même page-(identifiant).php ou encore page-(nom).php.

      Répondre à Marlène
  • Loïc

    Bonjour,
    J’ai intégré la ligne de code et ça fonctionne bien. Cependant, je voudrais paramétrer l’affichage du tag seulement quand il est mentionné dans au moins 3 articles.
    Savez-vous comment procéder ?
    Merci

    Répondre à Loïc
    • Marlène

      Bonsoir, je viens de tester ce code sur mon blog littéraire et ça fonctionne, il n’affiche les tags que lorsqu’ils apparaissent dans plus de 2 articles :

      <?php
      $tags = wp_get_post_tags($post->ID);
      if ($tags) {
      echo '<div class="displaytags">Thèmes : ';
      foreach($tags as $tag) {
      if ($tag->count > 2) {
      echo '' . $title . '<a href="' . get_term_link( $tag->term_id, 'post_tag' ) . '" title="' . sprintf( __( "%s" ), $tag->name ) . '" ' . '>' . $tag->name.'</a> ';
      }
      }
      echo '</div>';
      }
      ?>
      Répondre à Marlène
    • Loïc

      Bonjour,
      ça marche nickel ! Il ne me reste plus qu’à personnaliser l’affichage. Donc si j’ai bien compris, il me faut créer une classe displaytags dans ma feuille de style (avec un . ou un # d’ailleurs ?).
      Merci beaucoup !

      Répondre à Loïc
    • Marlène

      Tu peux le faire si tu souhaites personnaliser le design de tes tags :)

      Comme c’est une classe, on met un point devant son nom. Le dièse est utilisé pour les « id », styles qui ne s’appliquent qu’à un endroit de la page. Ici, on aurait pu d’ailleurs mettre un « id » (au lieu d’une classe) car on n’affiche les tags qu’à un seul endroit de la page. Mais la classe étant très polyvalente, j’ai tendance à l’utiliser systématiquement sauf quand une situation précise exige un id (par exemple, pour faire un lien vers un endroit précis d’une page web, on va pouvoir se servir de l’id).

      Répondre à Marlène
  • eloditout

    bonjour

    cet article est super mais malheureusement dans mon thème je n’arrive pas a trouvé ce dont vous parlez ni dans l’apparence ni la ou j’ai installée le fichier ? je dois mal comprendre quelques choses mais je ne vois pas quoi ?
    avez vous une autre idée ?

    merci d’avance

    Répondre à eloditout
    • Marlène

      Bonjour Elo, le thème Loma que tu utilises semble prendre en charge les tags par défaut (je les vois s’afficher sur la démo). A mon avis, tu n’as donc même pas besoin de toucher au code du thème mais juste de trouver l’option qui permet de les afficher. Je te conseille de regarder dans la documentation de ton thème ou de contacter le créateur du thème.

      Répondre à Marlène
    • eloditout

      oui c’est une option
      Je l’ai activé mais je voulais l’affiner comme dans ton billet avec une mention Cet article parle de …
      Mais je n’ai pas de single.php
      Dommage

      Répondre à eloditout
    • Marlène

      Le thème est sans doute construit autrement… Dans ce cas, il faut faire une recherche dans les fichiers du thème pour savoir où se trouve la ligne qui contrôle les tags (sur PC on peut utiliser un logiciel gratuit comme TextCrawler pour explorer rapidement le contenu de tout un dossier)… ou contacter le développeur du thème pour lui demander quoi modifier. Comme c’est un thème payant, il te donnera peut-être une réponse rapidement.

      Si tu n’as pas modifié ton thème jusqu’à maintenant, je te déconseille de toucher directement aux fichiers du thème car si le développeur le met à jour, tu perdras toutes les modifications effectuées. Pour modifier un thème WordPress « proprement », il faut créer ce qu’on appelle un thème enfant et faire les modifications dedans.

      Répondre à Marlène
Si vous aimez les articles du site, n'hésitez pas à faire vos achats sur Amazon.fr via ce lien ; il me permettra de toucher une commission grâce au programme Partenaires Amazon EU.