• Contact
  • L’esPresso
  • Guide blogging
  • Les Prestations
  • Mentions
  • A Propos

La bible du blogueur débutant
facebook
linkedin
rss
twitter

  • •••
  • Se former
  • WordPress
    • Utiliser
    • Plugins
    • Performances
    • Themes
    • Reférencement
  • Blogging
  • Gerer un site
  • blablog
  • Participer
    • On parle blogging ?
    • WP c’est vous !




Theme WordPress : The Loop

06 juin 2011
by stephane
creer, modifier, themes, wordpress
7 Comments

the_loop est la fonction que vous allez devoir apprendre à connaitre pour travailler avec WordPress. Cette boucle permet, entre autres, d’afficher l’article demandé par vos visiteurs.

De prime abord, la chose n’est pas forcément évidente à appréhender. Pourtant, une fois le nez dedans, vous verrez rapidement comment en faire usage, et vous découvrirez que ce n’est pas si sorcier que cela.

Vive les marqueurs !

Pour simplifier la création de thèmes, les développeurs WordPress ont eu la bonne idée de nous fournir des marqueurs qui affiche directement le contenu souhaité sans que nous devions nous même passer par l’interrogation de la base de données. Un marqueur est en fait un fonction phpLangage serveur qui permet de généré les pages de votre site à la volée selon les informations demandées par l’internaute. Fonctionne traditionnellement de concert avec un base de données, de type MySQL. Avec PHP, on parle de site dynamique. qui se charge d’exécuter un code précis.

Le contenu d’un article est donc subdivisé en plusieurs marqueurs. Ces derniers ne fonctionnent que dans la boucle. Vous pourrez, plus tard récupérer le contenu de vos articles en dehors de la boucle, ceci fera l’objet d’un prochain article.

Revenons-en à notre boucle et à nos marqueurs. La boucle, invariablement commence toujours comme suit :

<br /><br /><?php if ( have_posts() ) : the_post(); ?><br /><br />

Si l’on traduit cela en langage humain, cela donnerait quelque chose comme : » Si tu as des articles, alors, montre les moi ».

A partir de cet instant, si la boucle a des articles à nous montrer, on attaque le code HTMLHtml : Langage courant des pages internet composé de balises qui permettent de structurer la page et son contenu.

Note sur le code HTML dans WordPress

<br /><br /><div id=post-<?php the_ID();?>">;<br /><br />

Le code html et les noms des balises CSSAcronyme de Cascade Style Sheet. Langage qui permet gère tout l’aspect visuel de votre site. On parle en français de feuille de style. employées sont laissées à la discrétion du graphiste. C’est sans doute aussi l’une des forces de WordPress qui permet la création de Thème sophistiqués sans être obligé de passer par un moteur de template comme Smarty.Vous avez donc tout le loisir de structurer votre page comme bon vous semble.

Détails des Marqueurs

Une fois notre boucle ouverte, nous allons utiliser les marqueurs de WordPress pour afficher notre contenu.

Le titre de l’article

Pour afficher le titre de notre article, nous utilisons le marqueur the_title

<br /><br /><h1><?php the_title(); ?></h1>;<br /><br />

Le titre est généralement placé entre les balises de type <hn>. Ces balises vont de 1 à 6. Le 1 pour les titres importants, le 6 pour les titres de moindre importance.

Date et commentaire

La date et les commentaires se gèrent comme suit :

<br /><p><br />Ecrit le <?php echo get_the_date(); ?><br><br /><?php comments_popup_link('Pas de commentaire', '1 commentaire', '% commentaires'); ?><br /></p><br />

Le marqueur the_date possède plusieurs options que je vous invite à découvrir sur le codexC’est la documentation officielle de WordPress, la Bible. Rédigée principalement en anglais, vous y trouverez (presque) tout au sujet de WordPress., tout comme comments_pop_link (qui affiche le nombre de commentaire lié à l’article.

L’article

L’affichage de l’article se fait en utilisant le marqueur the_content

<br /><br /><?php the_content(); ?><br /><br />

Ne placez pas le contenu de votre article dans des  balises html ! Votre article contient déjà des balises pour être mis en forme, vous risqueriez d’avoir des soucis d’affichage.

Fermer la boucle

Dès lors que le contenu est affiché, le travail de la boucle est quasiment terminé. Il nous reste donc à « fermer » la boucle pour éviter d’avoir une belle page blanche ou un beau message d’erreur de PHP (en fonction de la configuration de votre serveurOrdinateur distant sur le quel les fichiers de votre site sont hébergés.).

<br /><pre><?php endwhile; else: ?><br /><p><?php _e('Aucun article ne correspond &agrave; votre demande.'); ?></p><br /><?php endif; ?></pre><br />

La ligne endwhile indique à PHP de fermer la boucle. Pour autant, le boulot n’est pas finis. Souvenez vous, nous avons commencer notre boucle avec la question « Si tu as des articles à me montrer », donc, il faut également dire à la boucle quoi faire si il n’y a pas d’articles à montrer.

C’est que fait la commande « else : » En langage humain, else : se traduit par quelques chose comme « Alors fait cela ». Dans le cas présent, nous demandons à notre code de nous afficher une ligne de texte indiquant qu’il n’y a pas d’article à afficher.

Enfin, nous fermons définitivement notre boucle avec la ligne endif;

Je vous recommande vivement la lecture de la documentation officielle sur le codex WordPress.

« Le fichier single.php
Theme wordpress : le footer »

Abonnez-vous

Abécédaire

Télécharger gratuitement le guide pour tout savoir et bien débuter dans le monde blogging.

esPresso

Recevez la meilleure source d'information pour WordPress, abonnez vous gratuitement.

 

Fait passer !

  • google-share

 

Article(s) lié(s)

  • Modifier ou créer son thème WordPress
  • Theme WordPress, le fichier index.php
  • Installer un thème
  • Theme wordpress : le footer
  • Thème Wordpress : Les Tags Conditionnel
  • Attentions aux Shortcodes
  • Comment choisir son thème
  • Le fichier single.php
  • Le fichier index.php de votre thème WordPress

 

 

Pour les moteurs, ça parle de :

  • comprendre loop wordpress
  • wordpress loop
  • marqueur wordpress
  • wordpress afficher seulement les titres des
  • wordpress afficher date de creation
  • voir plus d\article wordpress
  • wordpresse exemple
  • tutoriel marqueur conditionnel wordpress
  • tuto exemple de boucle wordpress
  • tuto afficher les articles dans une page wordpress

7 Comments
  1. anthony (@synapse_studio) (@synapse_studio) 6 juin 2011 at 13 h 28 min Répondre
    [veille] Theme WordPress : The Loop http://bit.ly/jJPeHc #wordpress
  2. Aventure Personnelle (@aventure_perso) (@aventure_perso) 7 juin 2011 at 8 h 45 min Répondre
    WordPress The Loop expliquée par l'exemple - http://ow.ly/5bv8i via @4h18
  3. Philippe OUSSET (@philippeousset) 7 juin 2011 at 17 h 09 min Répondre
    The Loop expliquée par l'exemple http://t.co/QpQaoH2 via @4h18 #wordpress
  4. Pingback: L’Hebdo WordPress : WordPress 3.2 – bbPress –

  5. Pingback: L’Hebdo WordPress : WordPress 3.2 – bbPress – | Choisir-son-CMS.tk

  6. Pingback: L’Hebdo WordPress : WordPress 3.2 – bbPress – | WordPress Francophone

  7. Pingback: L’Hebdo WordPress : WordPress 3.2 – bbPress – thèmes

Woo ! T'en penses quoi ? Annuler la réponse.

*
*

captcha *

Récupérez le lien vers le dernier article de mon blogMontrer plus d'articles

Notifiez-moi des commentaires à venir via email. Vous pouvez aussi vous abonner sans commenter.

Abécédaire

Télécharger le guide du blogging



Publicité


Y'a ça aussi à lire

Le projet, ou la lutte entre doutes et compétences
21 mai 2012
un thème premium pour wordpress
Nouveau design sur 4h18
20 mai 2012
Je ne suis pas un robot
18 mai 2012
Pourquoi je blogue, par Benjamin
17 mai 2012
WordPress : Slider or not slider ?
17 mai 2012

Thèmes WordPress (sponsors)

  • Landscaper - Fullscreen Business WordPress Theme
  • WOW! mySite WordPress Mobile Theme
  • Switch - Responsive WordPress Theme
  • Velvet: Clean, Responsive WordPress Theme
  • WowWay - Interactive & Responsive Portfolio Theme
  • Spark - Responsive One-Page HTML5 WordPress Theme

Recherches populaires

  • 1&1 my website
  • mailchimp
  • 1and1
  • mailchimp en français
  • utiliser wordpress
  • menu wordpress
  • wordpress multisite

Les plus bavards

4h18 - Stef' (@4h18) (@4h18)
150 comments
Jérôme COMMARET
122 comments
anthony (@synapse_studio) (@synapse_studio)
47 comments
BoiteaWeb
32 comments
Arle Uein@La Gazette
26 comments
Mathias@incanorama
24 comments
valérie thuillier
21 comments

Thèmes WordPress

Elegant Themes

Thèmes Magazine

Les meilleurs thèmes WordPress

WordPress Premium par oBox

Templatic WordPress Themes

Liens utiles

  • Boite à Web
  • Euklide
  • GeekPress
  • Mademoizelle Geekette
  • SEOMix
  • wp channel
  • WPTrads

WordPress & blogging par 4h18