Overblog Suivre ce blog
Editer l'article Administration Créer mon blog

Données : Articles

Les articles sont au coeur même des blogs. Il est donc normal de pouvoir les lister de plusieurs façons, et de les manipuler en profondeur

Liste des articles

Sur chaque page, une variable Posts permet de lister les articles à afficher. Pour l'accueil, une page de tag, une page d'archive, on dispose de plusieurs articles. Pour un article seul, un seul article est listé.

{% list Posts %}
    <h2>{{ Post.Title }}</h2>
    <div>{{ Post.Body }}</div>
{% endlist %}

Informations générales

On dispose pour les articles de beaucoup de possibilités.

Titre de l'article

<h2>{{ Post.Title }}</h2>

Résumé de l'article

<p>{{ Post.Snippet }}</p>

Vignette de l'article

<img src="{{ Post.Cover | resize(50,50) }}"/>

Date de l'article

<span>{{ Post.Date | datel("Y m d") }}<span>

Auteur de l'article

Publié par {{ Post.Author }}

Texte de l'article

<div>{{ Post.Body }}</div>
Il est possible de choisir combien de section on affiche.
<div>{{ Post.Body(3) }}</div>

Nombre de commentaires

<a href="{{ Post.PermaLink }}#comments">
  {{ Post.CommentCount('comment','comments') }}
</a>
Il est possible de choisir 2 textes : singulier et pluriel.

Les commentaires (affichage + saisie)

{{ Post.CommentCount }}

Liste des tags

{% list Post.Tags %}
    #<a href="{{ Tag.Url }}">{{ Tag.Title }}</a>{% if loop.last == false %}, {% endif %}
{% endlist %}
On utilise loop.last pour savoir si on doit ajouter une virgule pour séparer les tags entre eux.

Exemple détaillé

Voici un exemple détaillé avec toutes ces possibilités

{% list Posts %}
    <h2 class="title">
	    <a href="{{ Post.PermaLink }}">
			{% if Post.Title is not empty %}
              {{ Post.Title }}
            {% elseif Post.Snippet is not empty %}
                {{ Post.Snippet|truncate(50) }}
            {% endif %}     
        </a>
	</h2>
  <div class="date">{{ Post.Date | datel("M d Y") }}</div>
  <div class="meta">
      {% if Post.Author and Post.Author is not empty %}
          <p><em>{{ Lang.Get('By') }} {{Post.Author}}</em></p>
      {% endif %}
      <p class="nbcom">
        <a class="comment-bubble" href="{{ Post.PermaLink }}#comments">
          {{ Post.CommentCount('comment','comments') }}
        </a>
      </p>
  </div>
  <div class="post" itemscope itemtype="http://schema.org/BlogPosting">
      <div class="entry">
          {% if Post.Tags is not empty %}
			<p class="tags">
              {% list Post.Tags %}
                  #<a href="{{ Tag.Url }}">{{ Tag.Title }}</a>{% if loop.last == false %}, {% endif %}
              {% endlist %}
			</p>
          {% endif %}
          {% if not isSingle %}
              {{ Post.Body(1) }}
              <p><a href="{{ Post.PermaLink }}" title="{{ Post.Snippet|title }}">{{ Lang.Get('Read more') }}</a></p>
          {% else %}
              {{ Post.Body }}
              {{ Post.CommentCount }}
          {% endif %}
      </div>
  </div>
{% endlist %}
  • Lignes 2 à 10 : le titre, avec un lien. Si le titre est vide, on utilise le début du texte du résumé.

  • Ligne 11 : la date de publication.

  • Lignes 13 à 15 : l'auteur de l'article

  • Lignes 16 à 20 : le nombre de commentaires

  • Lignes 24 à 30 : la liste des tags

  • Lignes 31 à 34 : sur une page de liste, on affiche le début de l'article et un lien pour lire la suite.

  • Lignes 34 à 36 : sur une page d'article seul, on affiche l'article en entier et les commentaires

Partager cet article

Commentaires

pelossenoire 09/02/2013 13:00

Que veut dire tag en Français ?

05/08/2012 18:52

Bonjour,
je trouve, un peu partout, dans le "html" du theme Twenty Eleven des <div class="cb"></div>. Merci de bien vouloir indiquer quel est son rôle.
Au plaisir de lire la réponse