Para que possamos mostrar estas imagens necessitamos de ter uma conta no picasa, um álbum e este álbum deverá ser público.
Para o exemplo usamos uma biblioteca do jquery chamada fancybox. Caso queira saber mais entre em:
http://fancybox.net/
Segue abaixo Exemplo:
---------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Album usando a API do Picasa + JQuery + FancyBox</title>
<style type="text/css" media="all">
html, body {margin: 0px; padding: 0px;}
body {background: #EAEAEA; font-family: "Trebuchet MS",Verdana,Arial,sans-serif; font-size: 14px; line-height: 1.6;}
a {outline: none; margin-right: 20px;}
a img {border: 1px solid #CCC; padding: 2px; margin: 10px 5px 10px 0;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://fancybox.net/js/fancybox/jquery.fancybox-1.2.6.css" media="screen" />
<script type="text/javascript" src="http://fancybox.net/js/fancybox/jquery.fancybox-1.2.6.pack.js"></script>
<script type="text/javascript">
//-- Aqui ele pega todos os elementos com class = zoom e monta o fancybox.
$(document).ready(function() {
$("a.zoom").fancybox();
});
</script>
</head>
<body>
<?php
$picasaUser = "foxconn.suporte"; // usuario do picasa
$id = '5543297699342918993';
/* ----------------- url do feed do picasa por usuario e album ---------------- */
$tt = file_get_contents("http://picasaweb.google.com/data/feed/api/user/{$picasaUser}/albumid/{$id}");
// busca as fotos de um determinado Album passado por parametro
$xml = simplexml_load_string($tt);
echo utf8_decode($xml->{"title"})."<br>".utf8_decode($xml->{"subtitle"})."<br>";
echo "<div id='album' align='center'>";
for($i = 0; $i < count($xml->{"entry"}); $i++) {
$media = $xml->{"entry"}[$i]->children("http://search.yahoo.com/mrss/");
echo "<a class='zoom' rel='group' title='".utf8_decode($media->{"group"}->{"description"})."'
href='".$media->{"group"}->{"content"}->attributes()->url."'>".
"<img src='".$media->{"group"}->{"thumbnail"}[1]->attributes()->url."' alt='imagem' /></a>";
}
echo "</div>";
?>
</body>
</html>
Espero que seja útil.
Abraço a todos.
Visite: http://www.sitez.com.br
Muito bom! Obrigado, vai me ajudar muito!
ResponderExcluir