Une galerie de photos flickr dans SPIP

16 janvier 2007,
par Romy Têtue

Mots-clefs associés à cet article :

Ou comment afficher une galerie de photos stockées ailleurs et choisies par les internautes ?

Flickr (prononcer « flikère ») vous permet de stocker vos photos en ligne pour les partager avec ami-e-s & famille et/ou avec tout le Web. C’est un site Canadien dont la vocation est la gestion de bibliothèques d’images publiques ou privées.
Il fait cela si bien qu’on est tenté de lui confier le tri et le stockage des photos, qui est alors autogéré par les internautes, pour se contenter de n’en faire qu’un affichage sélectif. Ceci se fait facilement avec SPIP 1.9 dont le système de syndication s’est enrichit.

Comment faire ?

style='float:right;'>
1 - Rendez-vous sur www.flickr.com à la page souhaitée, par exemple celle des photos comportant le tag « spip », pour y trouver le flux RSS correspondant : référencez cette page et syndiquez-là dans votre site SPIP.

2 - Sélectionnez vos options de syndication, en cochant « syndiquer le contenu complet des articles (au format HTML) », afin de syndiquer également les fichiers images. Les photos de flickr doivent alors s’afficher sur la page du site, dans l’espace privé.

3 - Dans le squelette, on construit donc une boucle SYNDIC_ARTICLES ordinaire pour lister les données ainsi récupérées, par exemple :

<BOUCLE_flickr(SYNDIC_ARTICLES) {!par date}>
<a href="#URL_ARTICLE">#TITRE</a>
</BOUCLE_flickr>

4 - Mais pour y afficher les photos, ce n’est pas si simple : flickr ne distinguant pas l’image du reste, il faut l’extraire du descriptif de l’article syndiqué grâce à |extraire_balise{img}. Comme ceci :

[(#DESCRIPTIF
    |extraire_balise{img}
    |image_reduire{200,180}
    |inserer_attribut{alt,[(#TITRE|textebrut|couper{60})]}
    |inserer_attribut{align,''}
)]

Exemple de code

Voici par exemple le code qui a servi a fabriquer les galeries de photos flickr des sites SPIP Party et tetue.net :

<B_flickr>
#ANCRE_PAGINATION
<ul>
    <BOUCLE_flickr(SYNDIC_ARTICLES) {!par date} {pagination}>
    [<li>
        <h3>#TITRE</h3>
        <a href="#URL_ARTICLE"[ title="(#TITRE|textebrut|couper{80})"]>(#DESCRIPTIF
                |extraire_balise{img}
                |image_reduire{200,180}
                |inserer_attribut{alt,[(#TITRE|textebrut|couper{60})]}
                |inserer_attribut{align,''}
                |unique{photo}
        )</a>
        <p><small>[(#DATE|affdate_court)][, <:par_auteur:> (#LESAUTEURS)]</small></p>
    </li>]
    </BOUCLE_flickr>
</ul>
[<p class="pagination">(#PAGINATION)</p>]
</B_flickr>
{#TITRE,#URL_ARTICLE,#INTRODUCTION}

Vos commentaires

  • Le 14 février 2010 à 19:35, par Paolo En réponse à : Une galerie de photos flickr dans SPIP

    Merci, Romy, ça marche très bien. Le problème que je rencontre est que le flux RSS de Flickr met les photos dans un tout autre ordre que celui qui s’affiche sur la page de Flickr. Ce dernier doit être réglé par un paramètre qui n’est pas transmis dans le flux RSS, je pense. Pour la page que j’aimerais faire, c’est important. Et je crois qu’il n’y a rien à faire :(

  • Le 19 février 2010 à 22:15, par Paolo En réponse à : Une galerie de photos flickr dans SPIP

    Et, d’après mes essais, cette boucle ne marche plus avec SPIP 2.1. Ou je me trompe ?

  • Le 24 février 2010 à 23:37, par havath En réponse à : Une galerie de photos flickr dans SPIP

    This is really excellent ! je vous y encourage vraiment et merci bcp pour tout ceci !

  • Le 16 avril 2010 à 03:44, par Claire En réponse à : Une galerie de photos flickr dans SPIP

    Ca fonctionne très bien merci ! ;)

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici
  • Raccourcis : {{gras}} {italique} -liste [bla->url] <q> <quote> <code>.

Suivre les commentaires : RSS 2.0 | Atom