Drag

Statamic : Antlers ou Blade pour afficher le contenu

maxresdefault.webp

Écrit par : Thibault Chazottes

Statamic : Antlers ou Blade pour afficher le contenu

Dans le volet blueprints et fieldsets, on a modélisé une page Ressources LinkedIn : héros (titre, description, bouton conditionnel, image), introduction Bard, bloc « liste d’articles ». Les données sont là (fichiers YAML sous content/) ; il reste à coder l’affichage.

Statamic propose son moteur de templates Antlers. Vous pouvez aussi rester sur Blade — les deux sont supportés. Voir Antlers et Views.


Antlers : le moteur « natif » Statamic

Antlers fonctionne comme Blade ou Twig : variables entre doubles accolades, boucles, conditions.

Exemple minimal :

{{ title }}

Statamic ajoute des tags (filtres / helpers) : {{ title | ucfirst }}, etc. L’intérêt principal : chaque type de champ est géré proprement. Pour un Asset, Antlers expose dans le contexte url, alt, title… sans instancier vous‑même la classe Asset — pratique pour les <img>.

Nommer les vues

Une vue Antlers doit se terminer par .antlers.html (ou .antlers.php selon config). Sans cette extension, Statamic ne l’interprète pas comme du Antlers — comme .blade.php pour Blade.


Exemple : liste d’une collection « livres »

Cas client : collection livres (titre, auteur, illustration, slider d’images, description Bard).

Fichier du type resources/views/livres/index.antlers.html :

  • Boucle sur la collection avec le tag Collection :
{{ collection:livres }}
  <article>
    {{ illustration }}
      <img src="{{ url }}" alt="{{ alt }}" title="{{ title }}">
    {{ /illustration }}
    <h2>{{ title | ucfirst }}</h2>
  </article>
{{ /collection:livres }}

Vous pouvez filtrer par id, limit, sort, etc. — comme une requête orientée contenu.

Pour une entrée seule : vue show.antlers.html sur le même principe, avec if / else, comme dans tout moteur de templates.


Blade : la variable $page (et équivalents)

Sur une vue .blade.php, Statamic injecte souvent une variable $page (objet du type Statamic\Structures\Page pour une page, ou l’entrée de collection selon le contexte).

Un dd($page) dans la vue montre toutes les données ; en production :

<h1>{{ $page->title }}</h1>

Pour un champ asset (ex. hero_image) :

@php $img = $page->hero_image; @endphp
<img src="{{ $img->url() }}" alt="{{ $img->alt() }}">

En Blade, vous manipulez l’objet Asset Laravel/Statamic — un peu plus verbeux qu’Antlers, mais familier si tout votre projet est déjà en Blade.


Mélanger Blade et Antlers : @antlers

Sur un site formation entièrement en Blade, la page Ressources LinkedIn peut rester en .blade.php. Pour certains champs (surtout Bard ou une collection à lister), recréer tout en PHP est lourd.

Statamic fournit les directives Blade :

@antlers
  {{ intro_description }}
@endantlers

Et pour lister une collection depuis Blade :

@antlers
  {{ collection:linkedin_posts }}
    <h3>{{ title }}</h3>
    {{ content }}
  {{ /collection:linkedin_posts }}
@endantlers

Vous gardez Blade pour la structure globale, Antlers pour les blocs « contenu Statamic ».


Page « Ressources LinkedIn » : rappel des données

Côté CP, l’entrée vit dans Pages (blueprint ressources). Côté disque, le YAML contient par exemple :

  • champs préfixés héros (hero_*) ;
  • intro_description (Bard) ;
  • titre du bloc liste.

Une collection linkedin_posts (ou nom proche) peut contenir des entrées simples (titre + contenu) en attendant une future synchro API LinkedIn (sujet Laravel à part).

Le template lit ces handles — en Antlers {{ hero_title }}, en Blade $page->hero_title (selon les noms exacts du blueprint).


Antlers ou Blade : que choisir ?

Contexte Piste
Site vitrine 100 % Statamic Antlers partout — recommandé par la doc
Grosse appli Laravel + Statamic + Nova Souvent Blade pour homogénéité
Projet mixte Les deux : fichiers .antlers.html et .blade.php selon les écrans

Statamic recommande Antlers, mais Blade n’est pas un pis-aller : c’est documenté et stable. L’essentiel : une fois le blueprint et les entrées créés, il faut une vue qui consomme ces champs.

Pensez aussi aux plugins IDE pour la coloration Antlers dans vos fichiers (VS Code, PhpStorm, etc.).


Vidéo : Antlers et Blade en pratique


Conclusion

Blueprint + entrée ≠ page publique : il faut brancher Antlers (tags collection, assets, modifiers) ou Blade ($page, objets Asset, @antlers pour Bard et collections).

Suite de la série : Statamic : flat file ou base de données — quel choix ?.