Galeria De Fotos Do Picasa No Seu Site Ou Blog

por em: , , , ,

Picasa web integrator.

Picasa Web Integrator é uma biblioteca em javascript que lhe permite, de forma simples e eficiente, inserir suas fotos do Picasa 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 e procure pela linha: pwi_username = “YOUR_USER_NAME_HERE”;

3 – Subistitua YOUR_USER_NAME_HERE com o seu login de usuário.

Para saber seu login, entre no Picasa e clique em algum álbum. No url irão aparecer o nome de login e do álbum corretos. Tenha em mente que esses valores podem ser diferentes do que aparece tanto na hora de você logar quanto na descrição do álbum. Portanto para saber o certo observe a URL do seu álbum. Exemplo: , onde gadarf é o login e Cosplay02 o nome do álbum.

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 três 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.

4 – Upe todos os arquivos do Picasa Web Integrator para seu serviço de hospedagem.

5 – Em toda página que quiser usar o álbum deverão ser inseridos os CSSs e scripts tal como no arquivo index.html.

6 – No local onde desejar inserir a galeria coloque o seguinte código:

This will contain the album(s)

.

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 comando

This will contain the album(s)

,

possui a mesma ID de uma outra DIV do meu template.

Mudando o nome de 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.

Abaixo encontra-se um exemplo, algumas opções do pwi-1.0.js foram alteradas para dar uma personalizada. Acessando a matéria “Grande Coleção Cosplay De Personagens Femininos” será possível ver outro exemplo. É isso, siga essas dicas que com um pouco de paciência você irá conseguir fazer a sua galeria também.

 

! 54 comentários até o momento

Escreva O Seu Comentário!

Ficou com alguma dúvida?
Tem uma crítica construitiva ou uma sugestão maneira?
Escreva ai embaixo, mas não maltrate o português, por favor!

  1. Marcos Santos comentou: responder

    Muito bom obrigado por compartilhar essa rica informação, uso muito o picassa!

  2. SILVIO comentou: responder

    TEM COMO EU COLOCAR SÓ UMA FOTO DO ÁLBUM ?
    OU FICAR TROCANDO A FOTO FICA UMA 3 SEGUNDOS E ABRE OUTRO NO MESMO LUGAR

    AGRADEÇO 1

  3. AntiNetBabylon comentou: responder

    Esses sites, redes sociais em geral, ao invés de melhorar sempre andam pra trás! Já existiu a opção própria de fazer isto! Agora tem que fazer toda essa gambiarra? Ridículo isso! Por isso não vou usar mais e nem divulgar em hipótese alguma um serviço lixo desses que ao invés de melhorar piora sempre, sempre nos dando mais trabalho para algo que deveria ser mais simples!!!!

  4. gadarf comentou: responder

    Isto vai depender da sua plataforma, mas de um modo geral elas tem a parte do editor visual e do editor em HTML.

    Você, acredito, deve ter upado tudo para um local, e valendo-se precisamente de todos os arquivos padrões fez funcionar.

    Para colocar nas postagens, apenas se baseie no index.html padrão, faça nas suas postagens todas as chamadas CSS e de JavaScript existentes nele, que então irá funcionar.

  5. Raimundo de Castro comentou: responder

    Olá!

    Eu já baixei a biblioteca, fiz a alteração adicionando meu Id e enviei para minha hospedagem, ela pode ser acessada pelo endereço

    http://www.castroweb.com.br/castrodigital/galeria/

    Se você acessar, pode ver que funcionou perfeitamente.

    Agora tenho uma dúvida:

    Como colocar o album com as fotos em miniatura dentro do post do blog?

    Pois ao colocar o comando – div id=”container” This will contain the album(s) /div – simplesmente não aparece o álbum. OBS: eu tirei os sinais de maior e menor que pois o comentário não estava sendo aceito.

  6. gadarf comentou: responder

    Tente a variável var pwi_album_only do arquivo pwi-1.0.js, e repare que o próprio arquivo tem instruções sobre cada uma das variáveis.

  7. Marina Lima comentou: responder

    Tem como colocar mais de um álbum? Pois aparecem todos os albuns públicos do Picasa e alguns não quero que apareçam.
    Pode me ajudar?
    Obrigada!

  8. gadarf comentou: responder

    Não tenho como saber onde vocês erraram, afinal não estou vendo o que fizeram, e se não usarem um português bem escrito fica ainda mais complicado de entender.

  9. Carlos Henrique Cardoso da Silveira comentou: responder

    Cara não consigo encorporar ele no site montei uma pagina em braco e coloqueoi cno corpo dela
    div style=”width: 500px” id=”container”>This will contain the album(s)Não vai upei eles para meu site coloquei todos numa mesma pasta fiz tudo só não consigo fazer ele aparecer.
    qual o código que vc usou para postar em seu blog, estou usando em um site mas me de uma luz por favor
    se puder mande para contato@submundotattoo.com.br

  10. Studio Vida Imagens comentou: responder

    como é o código para ser colocado no post para mostrar o Picasa Webalbum Integration Library como esse seu?
    desde ja agradeço.

  11. gadarf comentou: responder

    Creio que ela aparece por padrão, se for isso basta estilizar com CSS, senão é no bom e velho arquivo de configuração.