Picasa Web Integrator é uma biblioteca em javascript que lhe permite, de forma simples e eficiente, inserir suas fotos do antigo Picasa, atualmente chamado Google Fotos, em um site ou blog. Tem como base visual o sistema Slimbox2, que certamente trarão um charme a mais para suas páginas. Saiba que são necessários conhecimentos intermediários sobre como criar sites para executar os procedimentos. Se tiver alguma dúvida deixe um comentário, mas lembre-se de dar detalhes sobre seu problema.
O sistema é muito prático, após instalado, a galeria de imagens ficará plenamente sincronizada com as fotos armazenas no Picasa. Mas nem tudo são flores, para executar o passo a passo a seguir serão necessários conhecimentos básicos de HTML além de um serviço de hospedagem:
1 – Faça o download do Picasa Web Integrator modificado.
2 – Abra o arquivo pwi-1.0.js com seu editor de texto
3 – Procure pela linha: pwi_username = “YOUR_USER_NAME_HERE”;
4 – Subistitua YOUR_USER_NAME_HERE com o seu login.
Como você já deve ter reparado o arquivo pwi-1.0.js contém a maioria das variáveis de customização. Já no passo quatro o sistema estará funcionando no modo standard. Para testar abra o arquivo index.html no seu navegador e as fotos e álbuns do Picasa deverão aparecer, a seguir:
5 – Upe todos os arquivos do PWI para sua hospedagem.
6 – Insera os scrips e css entre as tags Head.
7 – No local da galeria insira uma DIV com id=”container”.
8 – Use o arquivo index.html como modelo nos passos 6 e 7
Funciona perfeitamente com o blogger também. Nele os scripts podem ser colocados tanto no template como diretamente no corpo do post (recomendado). Dependendo das configurações de CSS do seu site bugs podem ocorrer. No meu, por exemplo, o visual ficou completamente torto. O problema era que o id=”container” já estava sendo usado por outra por outra DIV.
Mudando o nome do ID nas configurações do PWI o problema se resolveu. A propósito o arquivo pwi-1.0.js possui muitas outras opções como: alterar o álbum a ser exibido, mudar o tamanho das miniaturas e da imagem grande, alterar os texto que devem ou não aparecer entre outras. Tudo muito bem comentado. É isso, siga essas dicas que com um pouco de paciência você irá conseguir fazer a sua galeria também.
Como você fez pra usar as opções Anterior | 1 2 3 4 5 6 7 8 9 10 11 | Proximo igual na sua demonstração acima???
Ja resolvi o problema que disse acima no código CSS pwi-1.0.css.
na tag .pwi_album{. Mudei o valor para um maior.
Valeuuu!
MARAVILHA!!!
Funcionou perfeitamente aqui. Valeu mesmo pela dica gadarf!
Só tenho uma dúvida, o album de baixo está ficando um pouco em cima da descrição do album de cima. Sabe o que pode estar acontecendo?
Se não for público não funciona e não entendi a segunda parte da pergunta.
Boa tarde amigo…usei a biblioteca e deu certinho.. só tem um porem..ele só mostra os álbuns que tiver a permissão como “publico”, tem como eu fazer aparecer só os álbuns “qualquer um com o link”?
Posso hospedar os arquivos no SkyDrive?
Pode ser que resolva caso esse nome já esteja sendo usado.
Para mudar vá no pwi-1.0.js e altere a variável var pwi_container_div para algo diferente. Não se esqueça de atualizar as DIVs para o novo nome.
Bom dia! Preciso de uma orientação simples:
“Mudando o nome de ID nas configurações do PWI o problema se resolveu”.
Onde é necessário mudar o nome da id? em quais arquivos devo mudar a palavra “container”?
Ao testar em meu site, as fotos que são as capas dos albuns ficaram sobrepostas, como que se estivessem espalhadas na tela. Esse procedimento de mudar a id resolve esse problema?
No mais, obrigado por esse post, ajudou muito!
Feliz 2012!
Eu mudei o nome do álbum no picasa e não atualizei aqui. Já esta arrumado, obrigado por avisar.
Cara a galeria não está funcionando mais. O que será?
A variável var pwi_album_crop e var var pwi_photo_crop fazem o que você quer, se deixar elas em 0 o plugin manterá as proporções originais da imagem na miniatura, mas se deixar elas em 1 ele irá cortar a imagem e tentar deixa-la quadrada.
Desse modo ficarão vários quadradinhos iguais, mas não funciona para todos os tamanhos de miniatura, sei que em 64 pixel fica correto, portanto coloque var pwi_album_thumbsize e var var pwi_thumbsize em 64.
Não tenha medo de fazer testes que vai dar certo.
como faço pra deixa as miniaturas do mesmo tamanho. desde já agradeço.
ótimo seu post
Precisa de um servidor para os aquivos, sem isso não da pra fazer por esse método.
Alguem ai sabe se isso funciona nossa site da WEBNODE? pois não tenho acesso ao servidor para upar os arquivos
Legal amigo, estava procurando algo simples e rápido não tava achando em php.
Com isso resolvi meu problema.. vlw mesmo t+
nao funcionou fizs todos os passos certo!
da uma olhada no codigo e alem do mais publiquei as fotos tambem e fica a mensagem procurando dados e tanto faz usar o login ou codigo
var pwi_username = “111711006958758751643”;
var pwi_container_div = “container”;
var pwi_album_only = “Teste”;
var pwi_album_thumbsize = 144;
var pwi_album_crop = 1;
var pwi_photosize = 800;
var pwi_thumbsize = 144;
var pwi_photo_crop = 0;
var pwi_maxresults = 999;
Não é mais fácil vc postar o código fonte que usou nessa pagina aqui?
so aparece a mensagem “This will contain the album(s)”
Tentei incorporar no meu site mas não consegui, sera que é por que eu to usando javascript pra abrir?
@Focado
Isso é extremamente simples pra quem conhece o mínimo de HTML. No passo 6 onde pede pra inserir
, coloque
. No lugar de 500px coloque o tamanho que desejar, e é claro de uma estudada em HTML.
@Leandro
Não tem nenhuma galeria nesse endereço, se quer que eu veja dê o endereço exata onde ela se encontra. Não sei o que quer dizem com cortada mas as miniaturas são geradas pelo picasa, o que da é pra mudar o tamanho delas apenas. Para tanto encontre o arquivo pwi-1.0.js, ache a linha var pwi_thumbsize e altere para um dos tamanhos permitidos. Esse arquivo tem muitas outras opções, e com instruções de uso, sei que estão em inglês mas basta usar o tradutor.