X

Le guide ultime de la boucle WordPress

Dans ce tutoriel, je vais aborder La Boucle, et comment WordPress l'utilise pour afficher vos articles et pages. Gardez à l'esprit que c'est légèrement plus avancé que nos tutoriels précédents. J'espère que vous trouverez ce guide ultime plus facile à comprendre que ce qui est disponible dans la documentation WordPress. Voici ce que nous allons aborder :

  • Une définition de La Boucle.
  • Flux de base de La Boucle.
  • Balises de modèle utilisées dans La Boucle
  • Que faire après La Boucle
  • Hiérarchie des fichiers de modèle

Si vous voulez mieux comprendre comment un thème WordPress fonctionne réellement en coulisses, continuez à lire.

Remarque : Ce tutoriel suppose que vous utilisez un thème WordPress standard, tel que le thème par défaut Kubrick. Pas de contenu multiple avancé... pour l'instant.

Qu'est-ce que La Boucle ?

Vous vous demandez probablement encore ce qu'est La Boucle. En gros, c'est ce qui affiche le contenu que vous voyez sur votre page d'accueil, vos articles uniques, vos pages, les archives, les résultats de recherche, et plus encore.

Si un utilisateur accède à votre page d'accueil, à vos archives ou à vos résultats de recherche – par défaut, La Boucle affichera un certain nombre d'articles tel que défini dans vos Options de lecture.

Options de lecture WordPress

Pour le moment, ma page d'accueil affiche 10 articles par page, ce qui correspond à ce que j'ai défini dans Afficher au maximum * articles. Sur les articles et les pages uniques – le même code de boucle de base affichera simplement uniquement cette page spécifique.

Flux de base de la boucle

Décomposons La Boucle en 3 parties.


1. Ce que vous voulez afficher dans La Boucle

<?php endwhile;?>

2. Ce qui est affiché lorsque La Boucle est terminée

<?php else : ?>

3. S'il n'y a rien à afficher

<?php endif; ?>

Si des articles sont disponibles dans la requête, elle commencera à les afficher dans une boucle while, ce qui est défini dans la partie 1. Lorsque la boucle while est terminée, elle affichera ce qui se trouve dans la partie 2. S'il n'y a pas d'articles trouvés, ou s'il y a une autre erreur 404, la partie 3 est affichée.

Balises de modèle utilisées dans la boucle

À moins que vous ne vouliez que 1. Ce que vous voulez afficher dans la boucle soit répété 10 fois sur la page d'accueil de votre blog WordPress, vous devriez probablement apprendre quelques-unes des balises de modèle de base. Examinons le code de index.php dans le modèle WordPress par défaut.

Décomposition de la boucle WordPress

Comme vous pouvez le voir, il y a pas mal de balises de modèle dans la boucle qui afficheront des éléments tels que le titre de l'article, le permalien, le contenu, etc. Je vais détailler chaque balise de modèle dans le thème par défaut de WordPress.

  • <?php the_permalink() ?> – Ceci affichera le permalien de l'article, c'est-à-dire http://www.themelab.com/?p=1
  • <?php the_title(); ?> – Ceci affiche le titre de l'article, c'est-à-dire Bonjour le monde !
  • <?php the_time('F jS, Y') ?> – Ceci affichera la date, c'est-à-dire 4 avril 2008. Une liste complète des façons de formater la date se trouve sur php.net
  • <?php the_author() ?> – Ceci affichera le nom de l'auteur, c'est-à-dire Leland. Ceci est commenté dans le thème par défaut.
  • <?php the_tags(‘Tags: ‘, ‘, ‘, ‘<br />’); ?> – Ceci affichera les étiquettes attribuées à l'article, séparées par des virgules, suivies d'un saut de ligne.
  • <?php the_category(‘, ‘) ?> – Ceci affichera les catégories de manière similaire aux étiquettes ci-dessus.
  • <?php edit_post_link(‘Edit’, ”, ‘ | ‘); ?> – Le lien d'édition de l'article ne sera visible que par ceux qui en ont la permission.
  • <?php comments_popup_link(‘No Comments »’, ‘1 Comment »’, ‘% Comments »’); ?> – Affichera le lien vers les commentaires. Ceci ne sera pas affiché sur les articles ou pages uniques.

Il y en a beaucoup plus listés sur la page Template Tags sur WordPress.org. Certains d'entre eux peuvent fonctionner dans la boucle, d'autres non.

Après la boucle

Jetons un coup d'œil au code après l'arrêt de la boucle dans le thème par défaut.

Après la décomposition de la boucle

Comme vous l'avez peut-être deviné, cela affichera la pagination que vous voyez sur la page d'accueil, les archives et les résultats de recherche. Ceux-ci ne seront pas affichés sur les articles et pages uniques. Bien sûr, vous pourriez remplacer cela par quelque chose comme PageNavi, mais c'est à vous de décider.

S'il n'y a pas d'articles à afficher (peut-être en raison d'une erreur 404), ce qui suit sera affiché après le else

Page introuvable

Désolé, mais vous cherchez quelque chose qui n'est pas ici.

Cela affichera le message Non trouvé ainsi que le formulaire de recherche. Dans ce cas, il devrait y avoir un code de formulaire de recherche situé dans un fichier appelé searchform.php dans le répertoire du modèle, ce qui est le cas dans le thème par défaut.

Hiérarchie des modèles

Certains fichiers de modèle auront la priorité sur index.php pour certains types de pages s'ils sont présents dans le répertoire du modèle. Vous trouverez ci-dessous quelques exemples de hiérarchie de modèles, classés par ordre de priorité.

Page d'accueil

  1. home.php
  2. index.php

Article unique

  1. single.php
  2. index.php

Résultats de recherche

  1. search.php
  2. index.php

Page 404

  1. 404.php
  2. index.php

Il existe quelques techniques plus avancées listées sur la page Hiérarchie des modèles sur WordPress.org.

Quel est donc l'intérêt de la hiérarchie des modèles ? Fondamentalement, vous pouvez l'utiliser pour créer de nouvelles mises en page pour différents types de pages WordPress sans trop modifier votre fichier index.php.

Conclusion

Vous avez donc maintenant (espérons-le) une meilleure compréhension de ce qu'est la boucle WordPress. N'hésitez pas à laisser un commentaire si vous l'avez aimé, détesté, n'avez pas compris, peu importe – j'accepte tous les commentaires. Abonnez-vous au flux pour toutes les dernières mises à jour sur les sorties de thèmes Theme Lab et les nouveaux tutoriels. Merci de votre lecture.

Commentaires   Laisser une réponse

  1. Je veux afficher le lien vers l'article précédent et suivant sur la page de l'article unique. De plus, le texte d'ancrage du lien doit être le nom de l'article respectif.

    Pouvez-vous me dire comment faire ?

    J'ai essayé d'intégrer dans single.php mais le nom de l'article ne s'affiche pas.

  2. Super, j'apprends à pirater la boucle, même au niveau RSS-Atom et ces bases me sont utiles. Continuez comme ça les gars.

  3. Merci, merci, merci.
    Je ne vous remercierai jamais assez. Tout le monde, y compris wordpress.org, dit 'mettez ce code dans la Boucle', mais PERSONNE ne disait ce qu'est cette satanée Boucle ! Sauf VOUS. Excellente aide.

  4. Tutorial de loop do wordpress « Galeria de scripts September 17, 2009 at 10:02 am

    [...] Lien vers le tutoriel [...]

  5. Je suis un chef de projet informatique qui, à une époque de sa vie, était un « technicien » pratique. Je suppose que cela me place quelque part au milieu du spectre entre l'informaticien mais ignorant en programmation informatique et le geek total qui pense et parle en C++.

    Le grand avantage de WordPress est qu'il est suffisamment simple à utiliser pour que même les personnes les moins averties en informatique puissent accéder à des fonctionnalités sophistiquées avec facilité, tandis que quelqu'un ayant un minimum de compétences techniques peut faire beaucoup de personnalisation.

    Bien que je ne sois pas un programmeur PHP ou Java, j'ai une formation en C#/VB.NET et je comprends les boucles et les structures de programmation. Ce peu de connaissances, associé à des tutoriels comme le vôtre, me donne la capacité de personnaliser avec les meilleurs « geeks » de l'informatique. Votre tutoriel était très facile à comprendre (probablement parce que j'ai une formation en informatique). Je pense que même sans cette formation, votre explication a rendu possible (avec un peu d'effort) de comprendre comment utiliser la « boucle » et un peu plus sur le fonctionnement interne de l'application WordPress.

    Merci !!
    Jerry Bucknoff, PMP
    Mon blog WordPress est blogs.pmbestpractices.com, un autre site fièrement propulsé par WordPress.

  6. 30 WordPress Development Tutorials | Pro Blog Design – Learningism September 7, 2009 at 2:18 am

    […] Le guide ultime de la boucle WordPress […]

  7. Wordpress Wednesday: 50 Links & Resources from around the web | Wordpress Guerrilla August 19, 2009 at 11:16 am

    […] Le guide ultime de la boucle WordPress […]

  8. 30 WordPress Development Tutorials | SEO & Web Design July 21, 2009 at 2:35 am

    […]  Le Guide Ultime de la Boucle WordPress […]

  9. 30 WordPress Development Tutorials at BLOG GRAPHIC DESIGN July 3, 2009 at 7:39 am

    […]  Le Guide Ultime de la Boucle WordPress […]

  10. James McWhorter May 27, 2009 at 9:29 am

    Très utile. Merci !

  11. WordPress Loop | Theme Heven April 23, 2009 at 10:27 pm

    […] Lire la suite… […]

  12. Derek Perkins April 5, 2009 at 9:27 am

    Merci pour la publication, elle m'a vraiment aidé. Ma seule suggestion serait de modifier vos balises de modèle afin qu'elles aient toutes le point-virgule de fermeture.

  13. J'essayais d'afficher une seule catégorie sur la page principale et j'ai réussi après avoir lu ce post avec la syntaxe exacte dont j'ai besoin pour modifier la boucle.

    http://www.nietoperzka.com/wptraining/custom-order-of-posts-on-main-page/

    Mais ensuite, j'ai eu des erreurs avec mes autres catégories et zones du site, mais une fois que j'ai lu votre post et qu'il expliquait davantage la hiérarchie des pages, j'ai créé un home.php séparé pour ma boucle de page d'accueil et j'ai laissé tout le reste identique à l'original.

    merci pour ce post.

  14. Jarod Taylor - Web Design & Web Development January 7, 2009 at 9:36 am

    […] si vous avez du mal à comprendre quoi que ce soit que nous venons de faire, je vous recommande de visiter ce tutoriel pour mieux comprendre le […]

  15. Puis-je modifier la boucle wordpress avec une fonction de plugin ?

  16. vous savez quoi, vous êtes tout simplement génial, je me demande pourquoi je n'ai pas trouvé votre site avant et pourquoi je ne suis pas passé à wordpress avant.

    J'ai également commencé à promouvoir votre site Web par le bouche-à-oreille ici en Inde.

    Récemment, je suis allé à une réunion de club Toastmasters et j'ai parlé aux gens de la qualité de votre site.

    Merci pour vos merveilleux conseils.

  17. TheMoonbase - Bookmarks » Blog Archive » The Ultimate Guide to the WordPress Loop | Theme Lab October 13, 2008 at 2:00 pm

    […] Le guide ultime de la boucle WordPress | Theme Lab car après tout ce temps, je suis TOUJOURS confus […]

  18. Une chose que j'ai trouvée particulièrement utile est la hiérarchie des catégories :

    1. category-6.php
    2. category.php
    3. archive.php
    4. index.php

    La première page vous permet d'avoir une page pour chaque catégorie. Wordpress utilisera « category-6.php » comme page par défaut pour la catégorie 6. Vous pouvez trouver le numéro de catégorie dans le backend en allant dans Gérer > Catégories, puis en cliquant sur une catégorie. Après avoir cliqué sur la catégorie, regardez dans la barre d'adresse et vers la fin, vous verrez : &cat_ID=6. Ce 6 est le numéro de catégorie. « category.php » sera le modèle par défaut pour toutes les catégories s'il n'y a pas de modèles de catégorie individuels (comme category-6.php) trouvés. Placez simplement ces fichiers PHP à la racine de votre dossier de thème.

  19. Guide vraiment utile, merci de partager !

  20. Cynthia Clinton August 20, 2008 at 9:33 pm

    Merci ! Enfin l'explication de la boucle que j'ai cherchée partout sur le web ! Maintenant je comprends. Merci, encore 😀

  21.   Table Of Contents Of Wordpress Tutorials, Helps, Tips and Tricks by aComment.net July 14, 2008 at 12:32 pm

    […] Le guide ultime de la boucle WordPress […]

  22. How To: Make your WordPress Search Results Unlimited | [Blog Tutorials] June 7, 2008 at 9:58 pm

    […] vous ne voudrez peut-être pas que vos résultats de recherche soient limités par les contraintes de la boucle WordPress standard. Voici un petit hack de code pour permettre à une recherche de renvoyer des résultats illimités, modifiant le standard […]

  23. Ultimate Guide to the WordPress Loop | [Blog Tutorials] June 7, 2008 at 9:50 pm

    […] Un excellent domaine pour commencer est d'apprendre comment fonctionne la boucle WordPress. C'est une fonction de base du blogging utilisée pour afficher les X derniers articles sur la page d'accueil de votre blog (pour les blogs traditionnels). Plutôt que d'entrer dans trop de détails ici, j'aimerais vous orienter vers un nouvel article de Themelab qui est conçu pour être le guide ultime de la boucle WordPress. […]

  24. Excuses, Wordpress, & Blogging | FPettit.com May 16, 2008 at 9:20 pm

    […] Le guide ultime de la boucle WordPress | Theme Lab […]

  25. TalkingApes.com » Blog Archive » Brad’s 2008 Link Extravaganza May 8, 2008 at 3:58 pm

    […] Le guide ultime de la boucle WordPress | Theme Lab […]

Ajouter un commentaire

Nous sommes ravis que vous ayez choisi de laisser un commentaire. Veuillez garder à l'esprit que tous les commentaires sont modérés conformément à notre politique de confidentialité, et tous les liens sont nofollow. N'utilisez PAS de mots-clés dans le champ du nom. Ayons une conversation personnelle et significative.

Liste de contrôle de lancement WordPress

La checklist ultime pour lancer un WordPress

Nous avons compilé tous les éléments essentiels de la liste de contrôle pour le lancement de votre prochain site Web WordPress dans un ebook pratique.
Oui, envoyez-moi l'eBook gratuit !