Boutons de tri des images affichées sur le site publique

Bonjour,

Dès lors que l’on peut associer des mots clés aux documents, je sais faire une boucle dans un squelette pour afficher les images de l’ensemble du site sur un mot clé ou un groupe de mots clés qui appelle uniquement les images taggées par ce mot clé.

Le premier problème est que je doit faire autant de squelettes que de mots clés concernés (11 en l’occurrence dans mon cas présent), et pas de combinaison possible entre ces mots clés pour en additionner deux par exemble.

Et donc surtout, comment pourrait-on faire pour créer des boutons qui filtreraient l’appel des images, donc des critères de tri, pour que le visiteur puisse cliquer et choisir un ou plusieurs mots clés pour afficher les images taggées en correspondance ?

Après une très longue recherche, je n’ai pas l’impression que ça existe, ni via un plugin ni sur une discussion. Cela me semblerait pourtant assez intéressant, non ? On voit ça sur pas mal de sites…

Je croise les doigts pour trouver une solution simple et efficace, qui réponde à la demande que j’ai aujourd’hui. Je précise que mes connaissances de code se limitent au html / css + quelques boucles SPIP de base !

En tout cas, comme toujours, un grand bravo et un grand merci à la communauté spipienne et bonnes fêtes à tous !

Qu’est ce donc qui t’amène à écrire cela ? Il y a sûrement moyen de faire avec un seul squelette.

Tu as regardé du côté du plugin Critère {mots} ?

En résumé, tu te fais un unique squelette qui liste tes documents avec le critère {id_mot?} dans sa boucle. Dans le même squelette tu as une boucle qui liste les mots du site avec un lien vers la page en cours pour passer l’id_mot souhaité pour filtrer ta boucle de documents. Et si tu pose tout ça dans un inclue, le simple ajout du paramètre ajax à l’appel de l’inclure fera que tout ça se passera en ajax sans rechargement de la page. Voilà le plan de route, à toi de jouer :slight_smile:

Bonjour et merci à vous 3 pour vos réponses rapides !
J’ai malheureusement dû interrompre mon travail pendant 1 mois, ce qui n’était pas prévu, aussi, je reprends seulement cette semaine avec toujours le même blocage. Mon niveau de code est trop basique dans ce domaine, je comprends l’idée générale mais après des heures de lecture et essais cette semaine, je n’arrive pas à la mettre en application.

J’ai testé le plugin « critère {mots} » que je ne connaissais pas mais je ne saisis pas comment l’utiliser pour ma problématique. En fait, j’avais utilisé l’article de Marcimat pour réussir à utiliser les mots clés sur l’appel des documents qui n’est pas si simple contrairement aux autres objets.

Deux choses, je vais tenter d’être synthétique et de classer les problèmes :

1/ J’ai réussi de la façon suivante sur la boucle du portfolio… Mais ici, le critère {tout} m’affiche l’ensemble des documents du site, y compris ceux qui n’ont pas de mots clé, j’ai donc dû lister l’ensemble des id avec le critère {id_mot IN 1,2,3,4}… mais qu’est-ce que ce sera quand j’en aurai 22 :laughing: ???

Ça donne ce code qui fonctionne, et je ne comprends pas ce que m’apporterai le plugin à ce stade. Sans doute parce que je ne sais pas l’appeler dans le code et que le critère {mots} ou {mots 100%} ne fonctionne pas ici…

<B_documents_portfolio_mot_tous>
	<div class="bloc clearfix documents_portfolio" id="documents_portfolio">
		<h2>Appel par tous les mot</h2>
		<ul>
			<BOUCLE_documents_portfolio_mot_tous(DOCUMENTS mots_liens){id_mot IN 1,2,3,4} {objet?}{id_objet?} {media=image} {par rang_lien, num titre, date}>[
			<li><a href="(#URL_DOCUMENT)" type="#MIME_TYPE" onclick="location.href='[(#URL_ARTICLE
		  |url_absolue
			|parametre_url{id_document,#ID_DOCUMENT}
			|ancre_url{documents_portfolio}
			)]';return false;"[ class="(#EXPOSER)"][ title="(#TITRE|attribut_html|couper{80})"]>[(#FICHIER
				|image_passe_partout{90,90}
				|image_recadre{90,90}
				|inserer_attribut{class,spip_logo}
				|inserer_attribut{alt,[(#TITRE|attribut_html|couper{80})]})]</a></li>
			]</BOUCLE_documents_portfolio_mot_tous>
		</ul>
	</div><!--#documents_portfolio-->
</B_documents_portfolio_mot_tous>

2/ Je comprends que le plugin amène, entre autres, l’usage d’un formulaire mais ça n’est pas forcément l’ergonomie que je recherche avec ce menu déroulant, aussi b_b, j’aime ta solution de boucle qui liste tous les mots pour en faire des boutons / liens, mais je ne vois pas comment, comme tu dis : « passer l’id_mot souhaité pour filtrer ta boucle de documents ».

J’en suis là, et évidemment ça ne peut pas fonctionner puisque je n’ai pas réussi à ajouter le paramètre du mot clé appelé dans le lien…

<BOUCLE_mots(MOTS){tout}>
	<ul>
		<li><a href="les-acces-en-image.html" class="ajax">#TITRE</a></li>
	</ul>
</BOUCLE_mots>

3/ Pour finir, ça n’est pas une question : j’aime beaucoup la piste en ajax, oui bien sûr ! Quand j’aurai résolu ces 2 premiers points, je pense que ce sera ok (le code ci-dessus est bien dans un inclure appelé de la façon suivante dans mon squelette, là ce devrait être ok :
<INCLURE{fond=inclure/images_thematiques,ajax,env}>

Merci encore à tous pour vos contributions géniales et aides précieuses, et très bonne année à toute la communauté spipienne !

Help ! Un petit up ?
Je continue de chercher mais ne trouve pas la bonne direction car sans doute, je ne sais pas pourquoi ni comment je devrais utiliser le plugin Critère {mots}, et surtout, sur ma boucle en Ajax, je ne vois pas comment on passe le paramètre des mots clés dans le lien ???
Bonne journée :slight_smile:

Un truc comme #SELF|parametre_url{id_mot,#ID_MOT} fera l’affaire.

Merci beaucoup b_b, je vais creuser et tester ce bout de code ! Ça aide d’avoir une piste quand on est une bille en code hors html/css :blush:
Donc tu me confirmes quà priori je n’ai pas besoins du plugin critère pour ce que je fais ?

Non, pas du tout, je te donne juste une piste technique :slight_smile: Le critère mots est indispensable à partir du moment où tu souhaites filtrer les objets d’un boucle ayant un ou des mots clefs en communs cf sa doc.

Me revoilà, j’ai avancé, mais je bloque encore :upside_down_face:

À mon grand regret, je patauge depuis 3 jours sur l’usage du plugin critère {mots}… Est-ce lié à une incompatibilité pour agir sur les documents ? Ou bien à mon trop faible niveau hors html/css/boucles basiques de spip :sweat_smile:

Grâce à toi, b_b, j’ai au moins réussi à organiser l’appel en ajax avec les paramètres de l’id du mot clé demandé, sur le portfolio, mais uniquement avec le critère de base {id_mot} et aucun des 3 critères du plugin. Et ça marche nikel… mais pour le choix d’un seul mot, or je souhaite pouvoir choisir 1 mot par groupe (2 groupes actuellement).

Ensuite bizarrement, je n’ai pas besoin du critère {mots_liens}, comme suivant les bons conseils de Marcimat, ça fonctionne très bien sans. Et par contre, si j’utlise un des 3 critères du plugin, alors là, ça n’appelle rien ??? :expressionless:

Donc sans le plugin, je peux filtrer les images sur 1 mot clé à la fois, mais pas plusieurs. Il faut donc le plugin et son formulaire, mais vraiment, j’ai relu la doc en détail au moins 10 fois sans voir ce qui m’échappe. Je n’y comprends rien, même installé, c’est comme s’il ne se passait rien et que SPIP ne reconnaissait pas ses 3 critères ! (mais sans message de debug « critère inconnu »).

Et pour finir, quand j’appelle le formulaire du plugin qui semble être la seule solution pour additionner les mots clés, il n’y a rien, là aussi, ça reste vide :smiling_face_with_tear:!

Je suis sous SPIP 4.3.4 et je désepère d’y arriver un jour… Si quelqu’un peu m’aider :pray:
Voici mon code appelé (sur la base de la boucle du portfolio, mais en INCLURE / ajax et qui fonctionne très bien en suivant le choix d’un seul mot clé…

<BOUCLE_mots(MOTS){tout}>
	<ul>
		<li><a href="[(#SELF|parametre_url{id_mot,#ID_MOT})]" class="ajax">#TITRE</a></li>
	</ul>
</BOUCLE_mots>


			[(#REM) Gestion du portfolio et des documents ]
<B_documents_portfolio_mot>
	<div class="bloc clearfix documents_portfolio" id="documents_portfolio">
		<ul>
			<BOUCLE_documents_portfolio_mot(DOCUMENTS){id_mot} {objet?}{id_objet?} {media=image} {par rang_lien, num titre, date}>[
			<li><a href="(#URL_DOCUMENT)" type="#MIME_TYPE" onclick="location.href='[(#URL_ARTICLE
		  |url_absolue
			|parametre_url{id_document,#ID_DOCUMENT}
			|ancre_url{documents_portfolio}
			)]';return false;"[ class="(#EXPOSER)"][ title="(#TITRE|attribut_html|couper{80})"]>[(#FICHIER
				|image_passe_partout{90,90}
				|image_recadre{90,90}
				|inserer_attribut{class,spip_logo}
				|inserer_attribut{alt,[(#TITRE|attribut_html|couper{80})]})]</a></li>
			]</BOUCLE_documents_portfolio_mot>
		</ul>
	</div><!--#documents_portfolio-->
</B_documents_portfolio_mot>