Comment ajouter des liens de navigation « next post » et « previous post » dans WordPress

J'aime bien les blogues qui affichent l'article suivant et l'article précédent au bas de leur article. Je trouve que cette option permet au visiteur de naviguer facilement à travers les articles. Au lieu de retourner à la première page du blogue, cette option est la seule qui permet la navigation d'un article à l'autre.  Le code s'insère dans un fichier seulement – single.php – et au bas du contenu dans le loop.

Sur ce blogue, j'ai opté pour le code qui permet non pas seulement la navigation "article plus récent" et "article plus ancien" mais aussi d'afficher le nom de l'article et d'ajouter le lien "accueil" au milieu. Vous pouvez aussi ajuster le code pour faire naviguer les articles par catégories. Le code "Template Tags/next post link" est expliqué chez WordPress.org et il y a beaucoup de support dans les forums pour ce code.

Les liens "Article plus ancien" et "Article plus récent" sur le web

nextpost_tc

nextpost_tf

nextpost_bb

Les liens de navigation sur ce blogue

navigation3

Comment créer les liens de navigation en 4 étapes

1. Ouvrir le fichier single.php dans vos fichiers WordPress;

2. Ajuster le code ci-dessous (texte orange) et l'insérer en dessous du code du contenu;

3. Sauvegarder single.php et le télécharger sur votre serveur;

4. Aller sur le web et rafraichir les pages de votre blogue.

Le code pour créer les liens de navigation sur ce blogue

<table width="590" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="271" valign="bottom"><img src="http://dianebourque.com/wp-content/themes/shades-of-blue/images/arrow-left.jpg" alt="post" /> Article plus ancien<br /> <?php previous_post(' %', ''); ?></td> <td width="10" valign="bottom"></td> <td width="40" valign="bottom"><a href="http://dianebourque.com" class="style1">ACCUEIL</a></td> <td width="7" valign="bottom"></td> <td width="268" valign="bottom"><div align="right"> Article plus r&eacute;cent <img src="http://dianebourque.com/wp-content/themes/shades-of-blue/images/arrow-right.jpg" /> <br /> <?php next_post(' %', ''); ?> </div></td> </tr> </table>

Tweet

Share