Web 2.0 Tips

Bueno todos conocemos el popular sitio de subida de fotos y albunes Flickr, donde todos los dias se postean infinidad de fotografías (la mayoria de buena calidad) y con buenas definiciones.

Ahora para hacer una galería desde PHP, solo tendremos que hacer uso de una librería llamada Magpie RSS, con la cual leeremos una metadata de Flickr y podremos armar la galería.

Primero lo primero, tener el feed que queremos mostrar, por ejemplo, supongamos que tenemos un sitio o sección donde hablamos de las Olimpiadas de Invierno en Vancouver y queremos mostrar unas fotos, lo mejor es buscar un álbun en Flickr que trate del tema, yo por ejemplo encontre este:

http://www.flickr.com/photos/14171139@N08/sets/72157623244837127/

Ahora como nuestra galería va a leer los datos desde un RSS y para no complicarnos la vida (DRY), tenemos la libreria libre Magpie RSS, la utilización es fácil por lo que seran pocas lineas de código.

Para incluir la librería deberemos bajarla e incluirla en nuestro script y ejecutar una función que nos devolverá un objeto:

// Requerimos la clase:
require('rss_fetch.inc');

// Llamamos la función con la URL de nuestro feed:
$rss = fetch_rss("http://api.flickr.com/services/feeds/photoset.gne?set=72157623244837127&nsid=14171139@N08&lang=es-us&format=rss_200");

Tan simple como eso ya tenemos los datos de nuestra galería, ahora es solo cuestion de presentarlos:

<?php

$img = array();

?>
<ul class="galeria">
<?php foreach ($rss->items as $photo) : ?>
   <?php  if(preg_match('#<img src="([^"]*)"#s', $photo['description'],$img)) : ?>
   <li>
      <a href="<?= $photo['link'] ?>">
          <img src="<?= str_replace("m.jpg", "s_d.jpg", $img[1]) ?>" alt="<?= htmlspecialchars($photo['title']) ?>" />
      </a>
   </li>
   <?php endif; ?>
<?php endforeach; ?>
</ul>

Antes de seguir explico:
Primero buscamos con preg_match, la imagen dentro de la descripción que nos devuelve, de esta forma atrapamos lo que este dentro del src del elemento img.

Otra cosa que verán, para los que no la conocian, es la forma recomendada de trabajar con PHP cuando se mezcla con código HTML, sin abrir llaves, y usando los dos puntos “:” y los endif, endforeach, etc.

De este modo ya tenemos listando las imágenes en nuestra web, ahora vamos a darle un poco de styles:

/* Le sacamos los puntitulos: */
ul.galeria {
    list-style: none;
}

/* Hacemos que lis LI se comporten como cuadros */
ul.galeria li {
    display: inline;
    margin: 15px;
}

Y listo, una galeria en PHP mostrando fotos de Flickr.

Recuerden que pueden hacerlo con cualquier Feed de Flick, solo necesitan que si o si sea en formato RSS 2.0 y de ahí pueden ir explorando. Se pueden mostrar las imágenes de un usuario en particular, de un albun, de una “tag” y asi etc…

No hay tips relacionados.