> For the complete documentation index, see [llms.txt](https://akyos.gitbook.io/book/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://akyos.gitbook.io/book/wordpress/details-du-theme/template-blade.md). # Template Blade ### Documentation officielle Vous pouvez retrouver la documentation complète et officielle de blade [ici](https://laravel.com/docs/9.x/blade) ### Introduction Blade est un moteur de template utilisé initalement dans Laravel, il offre énormément de possibilité pour construire des vues, tel que la possibilité de faire des rendus conditionnels, ou encore des boucles directement dans vos vues. Il s'agit donc d'un moteur très puissant, cependant attention à ne pas en faire n'importe quoi. > La principale fonction d'une vue est de rendre les informations, et en aucun cas le traitement de ces informations ne doit être fait dans un fichier blade. ### Les bases Le fonctionnement de blade repose en grande partie sur l'utilisation de directives. La plupart du temps, une directive s'ouvre et se ferme avec le mot clé end. Exemple : ```html @if($condition)

Je suis rendu si la condition est vérifié

@else

Je suis rendu si la condition est fausse

@endif ``` > Il en va de même pour 80% des directives, une directive `@while` se fermera avec une directive `@endwhile`, `@for` avec `@endfor` etc... ### Les boucles Les boucles sont très intéressantes dans le traitement des donnés afin de les afficher. Toutes les boucles en php sont présentes dans blade via des directives, comme `@foreach`, `@for`, ou encore `@while` Exemple : ```html @foreach($posts as $post)
@thumbnail($post, "full")

{{ $post->title }}

{{ $post->excerpt }}

@endforeach ``` > Note: Ici, nous avons utilisé `{{ $variable }}` qui est une autre fonctionnalité de blade permettant de rendre des variables php directement dans l'html. Le code entre brackets ne sera pas interpreté comme du HTML mais bien comme du texte. Si vous avez besoin de rendre du code HTML, utilisez la syntaxe `{!! $variableHTML !!}` #### Variables intégrés A noter aussi que blade fournit des variables integrés dans les boucles, tel que `$loop->index`, ou encore `$loop->remaining`. [Voir liste des variables intégrés](https://laravel.com/docs/9.x/blade#the-loop-variable) ### Bonne pratiques En effet, il est possible d'utiliser la directive `@php` dans vos template blade, cependant il est fortement recommandé de limiter au maximum leur utilisation. En effet **Tout traitement de données doit être effectué préalablement dans un composer**. [Voir explication sur les Composers](https://akyos.gitbook.io/untitled/php/wordpress-sage/composers) > De même lorsque vous êtes dans une boucle, si vous avez besoin de compter les itération, pour [AOS](https://akyos.gitbook.io/untitled/js/modules) par exemple, privilegiez la variables `$loop` plutot qu'une directive `@php` Exemple : 
@foreach($posts as $post)
<article 
  class="post-card" 
  data-aos="fade-left" 
  data-aos-delay="{{ 100 * $loop->index }}"
/>
  <a href="$post->link">
    <div class="image-wrapper">
      @thumbnail($post, "full")
    </div>
    <div class="content">
      <p class="title">
        {{ $post->title }}
      </p>
      <p class="excerpt">
        {{ $post->excerpt }}
      </p>
    </div>
  </a>
</article>
@endforeach
### Directives Customs Le thème Akyos intègre aussi quelques directives custom tel que `@thumbnail` utilisé ci dessus. Vous pouvez retrouver une liste complète de ces directives [ici](https://akyos.gitbook.io/untitled/php/wordpress-sage/directives) ### Précisions Il est en effet possible d'utiliser les [composants](https://akyos.gitbook.io/untitled/php/wordpress-sage/component) dans vos template blade. Pour ce faire appelez votre composant en utilisant une balise `x-` suivi du nom de votre composant Exemple : ```html ``` Vous pouvez bien sûr passer des paramètres à vos composants. ```html ``` > Note: Ici, on rajoute `:` devant l'attribut `description` afin de lui spécifier que le contenu de notre description est une variable et doit être interpreté comme du php