Ajouter une boucle dans un article Joomla pour utiliser un "Slider Boostrap"

Dans un article Joomla, j'ai crée un "field" répétable ("titre" + "Description") que j'ai récupérer dans mon override d'article.

Afin que le Slider Boostrap fonctionne convenablement, il est nécessaire d'avoir des ID unique Voici l'explication :

 

<?php foreach (json_decode($rnChamps["faq"]["rawvalue"], true) as $faq) : ?>

devient : 

<?php foreach (json_decode($rnChamps["faq"]["rawvalue"], true) as $key => $faq) : ?>

ensuite on ajoute l'incrémentation aux id et target du "Slider Boostrap" comme cela 

<div class="card-header" id="heading<?php echo $key; ?>">

Et voici ce que ca donne globaement

 

                    <div class="jlf-accordion" id="JLFaccordion">
            
            
                      
            <?php foreach (json_decode($rnChamps["faq"]["rawvalue"], true) as $key => $faq) : ?>


  <div class="card">
  <div class="card-header" id="heading<?php echo $key; ?>">
      <h2 class="mb-0 hvr-grow">
        <button class="collapsed btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapse<?php echo $key; ?>" aria-expanded="false" role="button" aria-controls="collapse">
           
           <span class="jlf-hp-faq-title"><?php echo $faq["title"]?></span>
           
        </button>
      </h2>
    </div>

    <div id="collapse<?php echo $key; ?>" class="collapse " aria-labelledby="heading" data-parent="#JLFaccordion">
      <div class="card-body">
       <?php echo $faq["description"]?>
    
      </div>
    </div>
  </div>
      <?php endforeach; ?>
</div>