Como integrar WordPress, PicasaWeb e LightBox

O PicasaWeb da Google, com certeza é o melhor e estável sistema/site de hospedagens gratuitas de imagem da internet. Quem usa o Blogger (Blogspot) acaba usando o PicasaWeb para hospedar suas imagens diretamente do painel do Blogger, pois esse é parte integrante. E você que usa WordPress.org pode também usa-lo para economizar espaço no seu host e ter certeza de que nunca perderá as imagens do seu blog.

Introdução e detalhes importantes

Você pode estar se perguntando porque usaria ele em seu blog WordPress já que pode hospedar as imagens em seu próprio servidor. Bom, usar o Picasa pode ser uma boa alternativa para diminuir o seu trafego mensal¹, ideal para quem paga planos de hospedagens limitados ou usa uma gratuita.

Outro ponto positivo é que assim evitamos hotlinks², outra coisa que pode consumir muito da banda de sua hospedagem.

E por último, você pode deixar seu blog mais rápido assim também, já que são abertas apenas duas solicitações de HTTP cada vez que seu site é aberto. Tendo imagens em outro servidor fará com que elas seja abertas separadamente dos arquivos de seu blog, deixando assim ele mais rápido e mais leve. Lembrando que você tem a segurança de usar um serviço da Google.

Instalando e configurando os Plugins

Agora vamos instalar os plugins para isso sugiro que vocês leiam o artigo Como instalar plugins no WordPress aqui do [ Ferramentas Blog ] caso tenha alguma dúvida de como proceder.

Procure e instale os plugins “Picasa Image Express” e “Lightbox 2”. Veja as páginas oficiais desse plugins aqui:

• Picasa Image Express
• Lightbox 2

Passo 1 – LightBox plugin

Depois de instados clique em “Lightbox” no menu “Configurações” e configure o plugin como na imagem a seguir:

O “Lightbox Apperance” na verdade é apenas skills/estilos de como irá aparecer (aqui você pode usar como bem entender). No plugin já vem 4 opções diferentes de cores para você usar.

Depois em “Auto-lightbox image link” ative para que ele faça automaticamente os links necessários para que as imagens sejam vistas pelo Lightbox.

E por último no “Shrink large images to fit smaller screens” ative também. Esta opção faz com que imagens grandes sejam redimensionadas para ficarem menores, mas isso é aplicado apenas quando você clica nelas para ver em Lightbox. Caso a imagem seja maior que sua tela, esta opção faz com que ela não passe esse tamanho, se ajustando da melhor forma automaticamente.

Para saber mais o que é Lightbox e como funciona, leia o artigo:

• Efetio Lightbox para imagens no Blog

Passo 2 – Picasa Image Express

Agora vamos configurar o Picasa Image Express. Para isso clique na opção dele no menu “Configurações” no painel do WordPress.

No espaço “Account Setup” você terá que colocar o seu nome de usuário do PicasaWeb. Isso significa que você tem que ter uma conta ativa no serviço. Pode ser qualquer conta d qualquer serviço do Google.

Antes, então, vá à página do PicasaWeb – http://picasaweb.google.com – entre com sua conta pra ativar, caso nunca tenha usado.

Como já é sugerido logo a baixo, seu nome de usuário normalmente fica no link de seu Picasa.

http://picasaweb.google.com/seu-nome-de-usuario

Você precisa apenas digitar ele neste campo. Para isso faça login no seu PicasaWeb, como já sugerimos antes.

No painel do PicasaWeb, no canto superior direito, abaixo de sua foto do perfil de usuário está o link do Picasa junto com seu nome, no painel da direita. Clicando em “Foto” você será levado para a mesma pagina, mas agora em cima de seu navegador você terá o seu link³ e o nome de seu “Picasa User”.

Depois disso, voltando para o painel do WordPress, escolha mais em baixo ative a opção:

Finalmente clique em “Salvar alterações”

Agora o plugin esta configurado e será possível acessar todas as suas imagens que estão hospedadas no PicasaWeb e colocar em seus posts.

Infelizmente o Picasa não permite que seja upada imagens pelo plugin ou por qualquer lugar que não seja em seu site ou pelo seu programa.

Saiba mais sobre o PicasaWeb:

• Como enviar imagens para o PicasaWeb
• Armazenar Imagens na Internet – PicasaWeb
• Editor de imagens Picasa 3.6 Pt-BR gratuito da Google

Para inserir as imagens em seus posts basta clicar no ícone do Picasa Image Express em cima do formulário de publicações:

Clicando nele (o último ícone com a logo do Picasa), vai abrir uma janela onde será possível consultar suas imagens hospedadas no Picasa.

Escolha a imagem que pretende colocar no post e clique em “INSERT IMAGE”. É possível escolher mais de uma, e assim você estará fazendo uma galeria em seu artigo.

Note que quando é inserida mais de uma imagem no post elas ficam uma de baixo da outra em seu formulário, mas não se preocupe, pois depois que você publicar elas ficarão alinhadas, uma ao lado da outra.

Outra coisa que vale a pena falar é que quando você escolhe a imagem do lado de “INSERT IMAGE” aparece também “OPTIONS” clicando nele teremos algumas configurações interessantes:

Aqui em “Insert As:” escolhemos se as imagens serão exibidas com miniaturas em “Clickable thumbnails” ou serão exibidas no formato grande em “Full-size images”. Caso você escolha a opção de miniaturas, suas imagens serão abertas em Lightbox. O que facilita muito a sua vida e faz sua página parecer mais profissional.

Depois temos a opção “Trumbnail size:” aqui podemos escolher o tamanho da miniatura e o “Crop 1:1” serve para deixar a miniatura quadrada, deixando ela com largura e altura iguais ao tamanho que você selecionou.

Em “Large image size:” é escolhido o tamanho que ela será aberta no Lightbox.

De resto o que vale apena falar é a parte de “Styles and formatting”.

Na opção “CSS class:” é possível escolher o alinhamento se é sem, para esquerda ou para direita.

E em baixo no “Image Margins”, você pode colocar um espaçamento entre a imagem e o texto de seu post.

Depois de feita as alterações basta apenas clicar em “INSERT IMAGE” e continuar a escrevendo seu post.

Notas de Rodapé:

Nota¹: Existem diversos planos de hospedagens e vários hosts que fazem isso, por exemplo o Uolhost e o Locaweb que são brasileiros e tem planos de hospedagem com transferência de arquivos ilimitados. Além deles existem outros aqui no Brasil, e também existem pelo mundo todo planos gratuitos. As vezes você pode optar por um plano mais barato e ter limitações como o trafego de informações.

Esse trafego mensal é medido a cada vez que alguém visita seu site ou atualiza sua página.

Num exemplo simples, se o seu trafego mensal é de 100 Gigas e você disponibiliza um arquivo qualquer pesando 1 Giga, ele poderá ser baixado apenas 100 vezes durante o mês, passando disso seu site ficará fora do ar até o começo do mês seguinte, ou será cobrado uma taxa extra por ter passado do limite de sua hospedagem.

Nota²: Quando alguém usa uma de suas imagens ou qualquer arquivo hospedado em seu servidor, estará fazendo Hotlink de seus arquivos, e isso irá consumir sua banda mensal também.

Nota³: Caso você não configurou algum link em sua conta do google, aparecerá números ai, sem problema, basta copiar eles e colar no “Account setup”.