#CACHE{0}
#SET{mon_tableau,#ARRAY}
<BOUCLE_mot(DATA){source table,#MOTS}>
[(#CLE|=={#VALEUR}|oui) #SET{mon_tableau, #GET{mon_tableau}|push{#VALEUR}} ]
</BOUCLE_mot>
<B_Compteur>
	<h2 class="fr-mt-3w" >#GRAND_TOTAL [(#GRAND_TOTAL|>={2}|?{articles, article})]</h2>

	<BOUCLE_Compteur(ARTICLES){recherche?}{!titre_mot=Exclure} {mots? 0}> </BOUCLE_Compteur>
</B_Compteur>

<B_articles>
	<div class="fr-col-12">

		<div class="fr-grid-row fr-grid-row--gutters " id="liste-articles">
			<BOUCLE_articles(ARTICLES){recherche?}{!titre_mot=Exclure} {mots? 0}{!par points} {0, #CONFIG{dsfr/paginationNb, 8}}>
			<!-- Tuile verticale -->
			<div class="#ENV{largeur,fr-col-12  fr-col-sm-6 fr-col-md-4 fr-col-lg-3 }">
				<INCLURE{fond=resume/article/carte-verticale,id_article=#ID_ARTICLE,liste=#GET{mon_tableau}} />
			</div>
			</BOUCLE_articles>

			<BOUCLE_suite(ARTICLES){recherche?}{!titre_mot=Exclure} {mots? 0}{!par points} {#CONFIG{dsfr/paginationNb, 8}, 1}>
			<div id="bouton-voir-plus" class="fr-col-12 fr-text-center">
				<button class="fr-btn">Voir plus d'articles</button>
			</div>

			</BOUCLE_suite>

		</div>
	</div>
</B_articles>


<script>
	[(#CONFIG{dsfr/filtreRecherche}|non) var mots = "";]
	var compteur = 0;
	$(document).off('click', '#bouton-voir-plus');
	$(document).on('click','#bouton-voir-plus',function(){
		// $("#bouton-voir-plus").detach();
		console.log(mots)
		compteur = compteur + #CONFIG{dsfr/paginationNb, 8};
		var apres = compteur + #CONFIG{dsfr/paginationNb, 8};
		var adresse = "#URL_SITE_SPIP/?page=articles-defilement-recherche&var_mode=calcul&recherche=#RECHERCHE" + mots + "&debut=" + compteur + "&apres=" + apres;
		$.get(adresse, function(data) {
			// Manipulez le contenu récupéré ici
			// Par exemple, insérez-le dans la div avec id "conteneur"
			// $("#liste-articles").append(data);
			$("#bouton-voir-plus").before(data);
		});
		console.log(compteur)
	});
</script>