Noticiado em: segunda-feira, 13 de outubro de 2008
Primeiramente peço para que façam uma visita a página Álbum de fotos - Lightbox onde se encontra o exemplo do que será explicado neste post, que é como montar um álbum de fotos no Blogger usando o lightbox.
... Mas, para quem não quer perder tempo abrindo uma nova página, basta clicar na imagem abaixo e ter uma pequena idéia.
Vamos então as explicações.
A primeira coisa a ser feita é ir a esse site e fazer o download do plugin lightbox V2.04.
O único trabalho que você terá agora é dezipar o arquivo e fazer algumas modificações em seu código!
- Hospede (recomendo google pages) 4 das imagens que estão na pasta “Images”; são elas:
- Closelabel.gif
- Loading.gif
- Nextlabel.gif
- prevlabel
- Abra o "lightbox.css" (dentro da pasta CSS) e substitua:
* url(../images/prevlabel.gif);
por
url("Link da imagem hospedada prevlabel.gif");
* url(../images/nextlabel.gif);
por
url("Link da imagem hospedada nextlabel.gif");
- Abra o lightbox.js e substitua:
* fileLoadingImage: 'images/loading.gif',
* fileBottomNavCloseImage: 'images/closelabel.gif',
por
* fileLoadingImage: “Link da imagem hospedada loading.gif',
* fileBottomNavCloseImage: “Link da imagem hospedada closelabel.gif',
A primeira parte está feita. Agora vamos hospedar os códigos javascript e CSS.
- lightbox.css
- builder.js
- effects.js
- prototype.js
- scriptaculous.js
- lightbox.js
Depois de hospedado os códigos, vamos ao Painel do Blogger >>> Layout / Elementos da página >>> E Adicionar um Gadget HTML/javascript. Agora basta colar essas 4 linhas de código fazendo as modificações que estão em destaque (azul).
<script language="Javascript" type="text/javascript">
var cssNode = document.createElement('link');
cssNode.type = 'text/css';cssNode.rel = 'stylesheet';
cssNode.href = 'Link (url) do código hospedado lightbox.css';
cssNode.media = 'screen';
cssNode.title = 'using lightbox 2 with GPC';
document.getElementsByTagName("head")
[0].appendChild(cssNode);
</script>
<script src=" Link (url) do código hospedado prototype.js" type="text/javascript"></script>
<script src=" Link (url) do código hospedado scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src=" Link (url) do código hospedado lightbox.js" type="text/javascript"></script>
E finalmente a última parte, que é chamar as imagens nas postagens com os seguintes códigos:
Para chamar uma imagem:
<a rel="lightbox" href="URL da Imagem"><img src="http://URL do Thumbnail" border="0"/></a>
Ou uma série de imagens (slideshow):
<a href=" URL da Imagem #1.jpg" rel="lightbox[Série]">Expressão de Link #1</a><a href=" URL da Imagem #2.jpg" rel="lightbox[Série]">Expressão de Link #2</a>
<a href=" URL da Imagem #3.jpg" rel="lightbox[Série]">Expressão de Link #3</a>
Em lightbox[Série], basta colocar entre colchetes o nome a série de desenhos relacionadas. Exemplo:
rel="lightbox[album] ", rel="lightbox[desenhos]", etc...
Para mudar alguns termos para o português é só editar as imagens e procurar no código (lightbox.js) palavras que estão em inglês e trocar pelo português. (Ctrl+f, ok?)
Qualquer dúvida é só postar um comentário! ;-)
Qualquer dúvida é só postar um comentário! ;-)
163 comentários:
cara ec tutorial e muito bom
+ so me esplica uma parada o google pages ñ acessa +!!! como faço pra fazer isso?
essa parte eu naum entendi:
"- Abra o lightbox.js e substitua:
* fileLoadingImage: 'images/loading.gif',
* fileBottomNavCloseImage: 'images/closelabel.gif',
por
* fileLoadingImage: “Link da imagem hospedada loading.gif',
* fileBottomNavCloseImage: “Link da imagem hospedada closelabel.gif',"
onde estão ecs arquivos? ñ encontrei!!!
Esses arquivos você encontrará na pasta "js" (do plugin lightbox, do qual você deve ter feito o download).
O nome do arquivo dentro dessa pasta é: "lightbox"
Lá dentro, nos códigos que você fará as modificações.
(control+f ajuda essas horas, ok?)
Qualquer duvida:
ledearaujo@hotmail.com
Ah sim... Quanto ao Google Pages.
É verdade, ele não está aceitando novos cadastros.
Mas tem o Google Sites que veio para substituí-lo.
O único problema com o Google Sites, são com as hospedagens de arquivos flash.
bro vlw!!!
consegui fazer essa parte.
so que no google sites ñ estou conseguindo hospedar esses arquivos:
# builder.js
# effects.js
# prototype.js
# scriptaculous.js
# lightbox.js
da esse tipo de erro:
ERRO: ".O tipo de arquivo ".js" não é permitido.
me ajuda ae!!!
posso te pedir um favor pro proximo tutorial?
"como hosperdar esses arquivos no google sites"
sou novo nessa area e tbm muita gente como eu ñ sabe hospedar certos arquivos nele!
vlw...
É Anibal, acabei de conferir aqui e infelizmente o Google Sites não está aceitando a hospedagem de arquivos javascript (e sei que existe o mesmo problema com as animações em flash).
Mas encontrei um link aqui com um tutorial ensinando a usar o Google Sites, que é esse aqui:
Templates Para Você
No final do tutorial há uma uma opção de hospedagem para arquivos javascript usando o Windows Live Sky Drive!
Boa Sorte!
véio conseguir fazer
lutei ate o fim. ñ desisti...
kkkkkkkkkkkkkkkkkkkkkk
agora minha duvida e so uma:
e sobre o slideshow
postei o url das imagens + qndo vou no blog
fika: Expressão de Link #1
Expressão de Link #2
Expressão de Link #3
como faço pra colocar as fotos menores em vez de fica "expressão de link #1"? como no exemplo acima!
vlw e muito obrigado pela ajuda!
incrivelmente eu conseguir hospedar javascript pelo google sites!
da uma olha no que eu fiz
http://aniballinsnet.blogspot.com/2008/10/blog-post.html
esse e um blog que eu to fazendo pro meu cliente ANIBAL, na verdade meu nome é YVES
é um blog bem simples mesmo so pra ele por noticias e fotos dele.
Fala aí YVES (hehehe :-) Agora sim!)
Para não aparecer essa "espressão de link#1", basta você tirar isso do código.
No exemplo eu usei uma tabelinha para poder agrupar os thunbnails (as imagens pequenas) e ficar da forma que está lá.
Qualquer coisa dá uma olhada no código fonte dessa página.
Olha como ficou o código da primeira fileira do meu álbum de fotos:
<a href="http://pondexter1.googlepages.com/Vomitando.jpg" rel="lightbox[img]"><img border="0" src="http://img111.imageshack.us/img111/1913/thumb1pu5.jpg" /></a> <a href="http://pondexter1.googlepages.com/turntable_hand.jpg" rel="lightbox[img]"><img src="http://img111.imageshack.us/img111/9538/thumb2zo4.jpg" /></a> <a href="http://img111.imageshack.us/img111/4629/coringaow8.jpg" rel="lightbox[img]"><img border="0" src="http://img111.imageshack.us/img111/7795/thumb3hp6.jpg" /></a>
E ai...
Vlw ae leandro vou tentar fazer o slide.
vlw mesmo pelas dicas. ajudou muito!!!
flw...
Olá, Leandro.
Segui o seu tutorial e tudo funcionou perfeitamente. Quero dizer, quase... No Firefox tudo ocorre tranqüilamente, mas abrindo pelo Internet Explorer dá problema e o blog não carrega. [www.aneldecaveira.com]
O problemas é que 62% dos que acessam meu blog usam o maldito IE. Pode me ajudar, por favor?
Olá Hoffmann... Olha só, creio eu que o problema pode ser outro. Como teste você pode até constatar que esta página do tutorial abrirá no Internet Explorer e o plugin funcionará perfeitamente e não irá acontecer nenhum tipo de Bug no IE.
O máximo que pode ocorrer é do plugin não funcionar se a página ainda estiver carregando. Nesse caso a imagem abrirá pura, sem nenhum efeito.
Caso você esteja usando um template, faça uma pesquisa para ver se outras pessoas não tiveram o mesmo problema.
Ou você pode desfazer todo o processo de instalação do lightbox (o que seria bem simples) e ver o que acontece!
Depois de verificado tudo isso você me dá o feedback e juntos a gente tenta resolver isso!
Abraço!
Opa, Leandro!
Retirando o gadget do Lightbox abre normalmente. O que ocorre com o Lightbox instalado é isso: http://skurl.com/d50b58
Hoffmann, eu dei uma pesquisada e infelizmente eu não encontrei nada a respeito sobre esse problema que você está tendo.
Aliás o único problema que as pessoas estão tendo mesmo é encontrar um lugar para hospedar os arquivos javascript, fora isso mais nada.
Caso você queira me mandar uma cópia do seu tamplate, eu poderia fazer alguns testes e tentar achar o problema com o maior prazer, ok?
Qualquer coisa meu e-mail é:
ledearaujo@gmail.com
"- Abra o lightbox.js e substitua:
* fileLoadingImage: 'images/loading.gif',
* fileBottomNavCloseImage: 'images/closelabel.gif',
por
* fileLoadingImage: “Link da imagem hospedada loading.gif',
* fileBottomNavCloseImage: “Link da imagem hospedada closelabel.gif',"
realmente não encontrei também estes arquivos pra substituição.
Bração, pa Z e boa!
Edson
Marília/SP
o lightbox.js apresenta apenas estes arquivos:
então, como substituir, segundo o tutorial. Estou com dúvidas. Obrigado!
hospedei a imagem abaixo pra vc ter uma melhor visualização do que falo:
http://i419.photobucket.com/albums/pp275/mcgee2005/lightbox.jpg
Edson
Marília/SP
Olá Victor!
Acabei de enviar a resposta para sua dúvida para seu e-mail. Mas o que você têm que fazer são necessariamente duas coisas:
- Dezipar o arquivo que você fez download do site que disponibiliza o plugin.
- Logo depois fazer as modificações nos arquivos específicos (usando o CTRL+F para facilitar na procura) .
Nesse caso você poderá usar o bloco de notas do windows, o Notepad ++, Dreamweaver, ou qualquer outro programa de sua preferência!
Abraço!
Olá Leandro,
Tudo bem? Estou escrevendo para dizer que estou gostando muito de visitar o seu blog. Cheguei até aqui procurando este tutorial.
Hoje penei para fazer este lightbox funcionar no meu blog de testes e só consegui quando usei o googlepages.
Uma pena porque fica restrito a um serviço de hospedagem que não atende a todos na web, né!
Só consegui quando hospedei todos os arquivos js incluindo o builder e o effects na mesma conta do googlepages.
Estou escrevendo para agradecer por um tutorial muito bem feito e didático.
Voltarei mais vezes!
Muito prazer,
Áurea
Templates para Você
Prazer é todo meu Áurea! :-)
Saiba que eu já fiz muitas visitas ao seu Blog (você deve ter percebido isso já nos comentários).
Principalmente quando precisei de auxílio na construção do meu Blog.
Sobre o seu comentário é verdade... Tem muita gente que não está conseguindo instalar o plugin, justamente por não ter uma conta no (extinto) Google Pages.
E você com certeza também já percebeu (li em seu tutorial)que o Google Sites não aceita a hospedagem de arquivos javascript. :-(
Mas enfim...
Obrigado pela visita Áurea! ;-)
Oi, Leandro!
O problema que ocorre no meu blog é este:
http://www.criarweb.com/faq/problema-ie-nao-pode-abrir-site.html
Mas ainda não sei como resolver.
Olá Hoffmann!
Acabei de ler a resposta de sua dúvida lá na criarweb e creio que tenha a ver sobre o que eu te falei na última vez.
Estava olhando o código fonte de seu template e reparei que ele está um pouco mal organizado.
Existem linhas de códigos que estão no lugar errado e reparei que há códigos javascript direto no HTML, sendo que você pode usar esses mesmos códigos adicionando-os na aba Layout do painel do Blogger (add widget - HTML/javascript).
Dá uma olhada nisso, faça algumas modificações e me diga se algo mudou, ok?
Abraço!
Hehehehehe! Meio mal organizado é elogio! Enfim, esse template Frankenstein é temporário. Vou ver o que consigo fazer.
Valeu!
Por nada Hoffmann!
Quando estiver com seu novo template você verá que as coisas vão melhorar lá com famigerado Internet Explorer! :-D
Se precisar de alguma dica lá no código é só falar!
Abraço e Boa sorte!
Leandro,
estou montando um blog, e por enquanto esta so em testes...
estou tentando colocar o lightbox, segui o tutorial ( acho q certinho )... , mas nao consigo gerar o efeito, sera q vc pode me ajudar?
adicionei vc no msn, quais horarios vc normalmente fica online ?
vlw
Fala aí AllFaiLz.N!
Posso ajudar sim... Sem problemas!
Já está adicionado no msn, ok?
Durante essa semana eu estarei on-line, aí a gente resolve isso!
Abraço!
Saalve cara.
depois de muito trampo consegui instalar com calma.
e ta funfando perfeitamente
meu site é esse.
www.profilesgostosas.net/
isso vai dar um valor muito grande ao template do site
porém em minhas postagens as imagens ficam uma embaixo da outra. diferente do seu exemplo
que a cada linha ficam 3 imagens.
no mesmo tamanho e tal.
e pra mim, aquele estilo de postagem seria EXELENTE
tem alguma dica de como postar assim?
PS: ja tentei pelo código fonte do seu blog de exemplo e mesmo assim não deu.
Fala mambolino! Bom seu site hein! :-)
Olha só... No exemplo que eu coloquei no tutorial eu fiz o seguinte:
Para deixar as fotos lado a lado, você deve ter reparado, eu tive que diminuí-las um pouco.
Tive que transformá-las em thumbnails.
Isso você consegue fazer em qualquer editor de imagens. No meu caso eu usei o Fireworks.
Só tenha cuidado para não diminuir muito.
Quanto a deixar as imagens lado a lado, você vai precisar fazer um cálculo do tamanho de sua Div. Pelo que eu vi lá, deve ter mais ou menos 500px.
Basta editar as imagens, e transformá-las em um tamanho que caiba a quantidade que você quer lá.
Se você souber mexer no Dreamweaver é uma boa também. Pois nesse caso você pode montar uma tabela para que as fotos fiquem lado a lado sem um espaçamento muito grande uma das outras.
Mas você pode fazer isso direto no editor HTML do Blogger se souber o básico de HTML sem problemas.
Qualquer outra dúvida estamos aí, ok?
Abraço!
ôpa, tranquilo. farei isso
o básico do html eu sei
só mechendo pra descobrir mesmo. melhor que tutorial e a curiosidade e mexer.
aprendi e editei o layout do blog completamente
e vou melhorar ainda mais.
só que o primeiro passo é a postagem de fotos.
no formato que ta agora
a pagina ta demorando muito carregar
ja tirei o espaçamento no html do blogger
ja fiz várias coisas e nada
pq são muitas fotos.
e a um tempo ja tava querendo esse efeito. fica muito bom, agora é só a postagem
vou almoçar, depois tentarei postar
muito obrigado mesmo
adicionei vc no msn também, pra qualquer duvida :D
valeu brigadão
O melhor tutorial lightbox que eu encontrei na net.
Excelente para iniciantes e um exemplo para os mais experientes.
Parabéns.. logo logo estarei usando em minhas novas postagens.
Eu que agradeço pela sua visita Hélio!
Obrigado pelos elogios! ;-)
olá,
uma dúvida, iniciante msm...
01 - pq hospedar builder.js e effects.js se não fiz nenhuma referencia deles nos códigos?
02 - o arquivo .css foi hospedado, como os demais, no SkyDrive. Algum problema com relação a isso?
desde já obrigado.
Olá!
Problema algum em hospedar os arquivos no SkyDrive. Se eles estiverem funcionando... Beleza!
Quanto a sua primeira dúvida você tem razão.
Como você deve ter reparado, a diferença entre colocar o plugin para funcionar no Blogger é um pouco mais complicado que colocar em um site de hospedagens comum.
Nessa linha de código seria onde os arquivos "builder.js" e "effects.js" seriam chamados:
<script src=" Link (url) do código hospedado scriptaculous.js?load=effects,builder" type="text/javascript"></script>
A referência existe. O que não acontede são desses arquivos serem chamados através de um link (no caso do Blogger).
Eu lhe digo que tem funcionado perfeitamente esse plugin comigo, mas não custa nada fazer uma pesquisa sobre esse novo fato!
Obrigado! :-)
ai leandro blz... muito legal este ligthbox ,e muito boa sua esplicação de implementar no blog...eu segui tuas intruções só que hospedei tudo no geocities logo após fiz uma postagem pra testar
nando~for~fun publicou um post sobre.. dicas para dias de chuva só que não abriu até o momento notei que o seu ligth box também não abriu de cara só na outra vez que assecei o teu site...seria uma quetão de espera...eu queria saber se as imagens tem que estar hospedadas no mesmo lugar...parabéns pelo blog
tudo ok Leandro deu certo era quetão de espera o sistema trabalha correto mesmo
show de bola meu amigo maior tempo que eu estava tentando essa magica
você mando muito bem neste tutorial =))
darei um geito de te passar os creditos vlw grande abraço ¨¨O¨¨¨¨O¨¨
Olá Nando! :-)
Rapaz, é isso mesmo. Para o lightbox funcionar é necessário que a página já esteja toda carregada... O que é um grande problemas para sites pesados! :-(
Uma procura rápida no google encontram-se várias daquelas dicas de otimização para site/blog.
Obrigado pelos elogios e boa sorte nando!
Sucesso!
Leandro blz...como eu uso mais o internete explorer só agora notei que o efeito não está
fucionando no meu firefox 3.0 ...eu tô muito sastifeito com o resutado , esse é o melhor tutorial que encontrei na web,porém gostária de saber o que poderia ter dado errado,já que no seu site abre o lightbox perfeitamente no firefox¨¨O¨¨¨¨O¨¨???
Olá Nando!
Eu estive olhando o seu código fonte e não notei nada de errado. O código para chamar a imagem está correto.
Imagino então que o problema seja onde você está hospedando os arquivos do lightbox.
Encontrei um tutorial no blog do Usuário Virtual que promete solucionar alguns dos problemas que o pessoal que quer instalar o lightbox está tendo por não possuir uma conta no antigo Google Pages.
É só clicar AQUI para dar uma conferida!
Depois você me diz se deu certo, ok Nando?
Abraço!
fala ai blz!!!
dei uma vizualizada thanhx...
o SkyDrive e muito legal,vô tenta outras hospedagens no google pages ñ deu certo pra mim,eu usu muito também o meus documentos na web do msn ...quando abri lá hoje tava a seguinte mensagem:
O serviço MSN Grupos será encerrado em fevereiro de 2009. Você pode migrar o seu grupo para o Multiply, o parceiro do MSN para grupos online nando~for~fun anuncio importante saiba mais no meus doc na web também é muito bom e parece que vai melhora mais...quanto ao ligthbox tô abrindo no IE tab dentro do firefox dá pra ir levando por iguanto até ficar style total...me diz como eu coloco uma cor mais suave no filtro...vlw abraço¨¨O¨¨¨¨O¨¨
Amigão não deu certo não, acho legal, mais não vou por só por conta de não saber ao certo onde por as pastas no servidor de hospedagem, creio que só da mesmo pra por em blog
No meu caso precisaria de uma explicação mais detalhada, tipo pra por em site e não em um blog, ai deveria explicar onde por as pastas, se tem que renomea-las, etc, etc, passo a passo, assim desse jeito não deu pra por não, infelizmente, pois acho muito legal esse efeito, se quizer me dar um auxilio passo a passo ficaria agradecido.
E-mail: finam007@yahoo.com.br
MSN: finam007@hotmail.com
Olá "finam007" ! :-)
Veja bem, esse tutorial foi feito especificamente para os usuários do Blogger, uma vez que, para conseguir o efeito do lightbox nessa plataforma é um pouco mais complicado que em um site comum, com hospedagem e tal (do jeito que você está querendo).
No próprio site onde você baixa a pasta zipada com os arquivos do Lightbox já tem uma pequena explicação.
Está certo que a explicação que tem lá é sobre onde colocar os códigos, mas o que você pode fazer e eu recomendo, são testes usando o Dreamweaver.
Já te adicionei em meu msn para a gente resolver juntos essa sua dúvida, ok?
Abraço!
blz leandro ...vomos começa novamete o ano né(rs)
só passei pra ver as novidades abraço¨¨O¨¨¨¨O¨¨
Cara, fiz tudo como esta ai, só estou com problema na hora de subir a imagem, eu coloco o código e substituo pelos links e talz, só que quando eu clico na imagem ela nao abre no lightbox, abre em hora pagina.....
Olá Diego!
Bem... Se você seguiu corretamente o tutorial, ok!
Experimente aguardar o carregamento completo da página antes de clicar na imagem.
Rola essas coisas no lightbox! :-)
Abraço!
Leandro onde devo colokar esse codigo de chamar uam imagem??
Esse código Maxtheu você deve colocar na postagem.
ok? ;-)
Vlw véi, brigadão, consegui colokar o visualizador de imagens no meu blog, esse foi o unico site em que achei o melhor tutorial que explicasse bem!!!!!
Vlw!!!!
Por nada Maxtheu! :-)
Eu que agradeço a visita e o comentário!
Abraço!
Cara adorei seu tutorial, mas eu fiz tudo certo e não deu... As imagenspodem até aparece, mas não no Lightbox, como faço para arrumar isto?
Valeu!
Bruno, você tem que observar se todos os arquivos foram hospedados corretamente.
Siga o passo-a-passo com bastante atenção que você consegue.
Ou senão você pode descrever o que está acontecendo para que eu possa tentar achar uma solução, ok?
Abraço!
oi, leandro fiz todo esse processo passo a passo no dreamwere, quando vou em visualizar no navegador clico no link e aparece a imagem, mas não tem o efeito loading? pode me ajudar
Patricia, no seu caso (rodar o LightBox localmente usando o DreamWeaver) eu recomendo seguir o tutorial original nesse link--> http://www.huddletogether.com/projects/lightbox2/.
Pois o tutorial deste post é direcionado as pessoas que querem o plugin do LightBox na plataforma Blogger!
Olá! Muito bom o tutorial! Consegui fazer tudo, mas quando insiro no meu blog, ocorre um conflito com o banner, que também utiliza arquivos ".js". Você sabe me dizer qual o problema?
Agradeço desde já!
Olá Igor!
Já li sobre outros casos de conflito. E o que eu soube a respeito da solução desse problema, é a retirada do código em Javascript do HTML.
Tente fazer com esse seu código o mesmo que você fez com os códigos desse tutorial. Hospedar e usar o painel do blogger.
Leandro, tentei utilizar esse procedimento que você me informou e não obtive o resultado esperado. Existe alguma outra forma de solução do problema? Gostaria muito de utilizar o Lightbox no meu blog.
Obrigado!
Fala Igor!
Rapaz, infelizmente não conheço. Geralmente a solução de conflitos - especificamente este que você informou - se dá com a retirada de códigos javascript do HTML (no caso do blogger).
O que eu posso aconselhar é que você tente novamente refazer o passo-a-passo do tutorial e retirar os códigos de .js do HTML.
Abraço!
Parabéns pelo tutorial! Ajuda bastante a galera! ;)
Cara, parece interessante!
Porém não funciona como deveria,
estou fazendo tudo certo!
Infelizmente não deu!
Olá Marden!
Infelizmente algumas pessoas não estão conseguindo colocar o plugin para funcionar.
A minha teoria é que haja algum confito de códigos.
Ex.: caso você já tenha algum código javascript no HTML.
Há casos também de pessoas que usam templates baixados de terceiros, em que o plugin também não funciona.
Mas enfim... Caso tente outra vez, lhe desejo boa sorte!
Leandro, existe um meio de colocar legendas nas fotos abertas pelo lightbox?
Abraço!
Fala Igor...
Rapaz, já vi esse esquema de colocar legendas usando plugins semelhantes ao lightbox, mas nele mesmo nunca testei ou fiquei sabendo se dá.
Qualquer hora dessas vou dar uma pesquisada... Qualquer coisa atualizo o Post com novidades!
Leandro
Muito interessante o seu blog e o tutorial está 10. Mas infelizmente não consegui rodar o lightbox no blogspot.
Montei uma página html (local) e funcionou direitinho, mas quando jogo o código HTML/javascript no blog não acontece nada.
Será que é porque eu uso um template baixado na net ? Tem alguma solução ?
Olá Fabiano!
Valeu pelos elogios!
Olha só... Já aconteceu isso mesmo!
Acho que aqui mesmo pelos comentários eu tentei ajudar num caso como esse. A pessoa baixou um template e dava um monte de erros quando ele tentava usar o plugin. :(
Bem... Como você deixou claro, voce seguiu direitinho o tutorial, então não saberia lhe dizer ao certo qual o problema.
Só uma coisa: Para o plugin funcionar, a página (site/blog) tem que ter carregado por completo ok?
Não sei se te ajudará, mas boa sorte!
nao consego acessar o lightbox.js
dá sempre uma mensagem de erro do "window" nao esta definido.
me ajuda ae cara
Olá!
Primeiro teria que saber em que momento aparece essa mensagem e em qual lugar você está hospedando seus arquivos para poder te ajudar.
Mas faça o seguinte: Hospede todos os arquivos relacionados ao plugin lightbox no host que indiquei na atualização do post. O nome dele é Ripway.
Fazendo isso talvez resolva seu problema, ok?
Abraço!
Olá td bem?
Cara, ficou muito show ta, funcionou 100%. Agora só vou ter q da uma encrementada pra ficar em slideshow qndo clik para abrir as fotos.
Vlw e parabéns.
NOSSA !
ja li uns 10 tutoriais sobre o lightbox e nenhum deles funcionava..mas o seu eh perfeito *.*
NOSSA!
vlw MESMO ! funcionou certinho e ainda de quebra vc me apresentou o ripway q eu nao conhecia e axei OTIMO
PARABENS pelo blog e obrigadao pela ajuda, sou novo nesse mundo de blogueiro e nunca mexi com html/java e nem nada dessas coisas.. consegui fazer tudo funcionar certinho e to tao feliz q vo arruma desculpa pra posta umas mil fotos no meu blog hoje
AUHEUHAHEhUHAe
ganhou um fan ;D
abraco...obrigadao denovo
Fala aí Zoadão!!! hehehe :)
Valeu pelos elogios e que ótimo que você se deu bem com esse tutorial!!!
Quanto a você estar começando agora, não esquente... Logo logo você estará fera!
Mais uma vez obrigado pelos elogios!
Abraço!;)
olá cara muito boa suas dicas , eu não sabia nem para onde ia esse negócio de lighbox ,mais no seu post eu entendi ...
mais só que aconteceu tipo um erro no meu ,no fire fox os icones next e prev não aparece ..eu coloco as fotos e abre direitinho ...mais esses icones não aparecem .. já IE8 eles aparecem normal ... como posso ageitar esse erro ????
espero a resposta cara ...vlw mesmo !!!!
Olá Geriel!
Rapaz, que estranho isso. Algo funcionar no IE e não funcionar no Firefox!
Infelizmente não tenho ideia do que possa estar acontecendo.
Caso esse problema estivesse acontecendo em todos os navegadores, eu poderia até ajudar... Mas nesse caso eu realmente não tenho ideia.
Até porque já que está aparecendo no IE, é sinal que a imagem está hospedada e linkada de forma correta.
Olhe novamente o tutorial para ver se está tudo certinho, ou no caso, troque o host onde vc está hospedando as imagens... Eu estou usando o Ripway (o link está no post).
Abraço!
Olá Leandro,
Estou tendo dificuldades para ajustar a imagem no meu site, qdo abre fica muito grande e não executa o efeito.
abraços
Olá Bete!
Vamos lá então... Começando pelo mais simples:
- Para evitar que as imagens fiquem muito grandes quando você clica no thumbnail (ou link), basta você diminuir as imagens (usando o photoshop, fireworks ou qualquer outro editor de imagens) antes de hospedá-las.
- Quanto ao efeito não estar dando certo, experimente hospedar as imagens e códigos referentes ao plugin lightbox no Ripway.
Qualquer dúvida é só perguntar!
ola leandro !! Parabéns pelo tutorial.. está super bem explicado.. foi o melhor que achei na net.. estou ainda construindo meu blog.. e coloquei o lightbox num portfolio .. a imagem abre.. o unico problema é que aquelas imagens que hospedei e mudei os codigos.. tipo salvar.. fechar e tals .. não aparece .. pq será heim???
Abraços e mais uma vez parabéns e obrigada pela grande ajuda...beijão
Olá Marinna! :)
Em primeiro lugar, valeu pelos elogios!
hum... Vamos lá.
O "problema" de não dar para salvar as imagens abertas é uma característica do plugin lightbox.
Mas o Fechar deveria estar aparecendo no efeito do plugin (assim como o next e prev).
Qualquer coisa Marinna, faça um teste e hospede todos os arquivos relacionado ao lightbox num mesmo lugar.
Eu estou recomendando o Ripway, pois é o que eu estou usando atualmente (mas tenha esses mesmo arquivos sempre hospedados em outro lugar por segurança, ok?)
No mais é isso... Qualquer coisa estamos aí!
Beijão!
Obrigada Leandro.. vou experimentar fazer assim como vc disse... depois te digo se funcionou.... beijãoo!!!!!!
cara eu nao consigo nao "/ so meio leito nesse assunto, da uma força aew *-*
OLa muito obrigado deu certo CLARO depois de umas 20 tentativas ...*isso que da nao ler antes de fazer*
mas depois que deu certo sempre surge uma duvida...
eu tenhu um blog no qual vendo bottons eu quero colocar uma imagem pequena no post e que ela fique no tamanho real quando clicado...
e detalhe 5 imagem uma do lado da otra como faço .... desde já brigadao ajudo muito
meu caraaaaaaaaaaaaaa eu te amo mto eu estava me matando pra encontar isso e consegui vlw mesmo ......
Brenner Marinho... Vai ver você está tendo o mesmo problema que o Caio Nascimento teve no inicio.
Eu recomendo ir lendo com calma e atenção. Dessa forma não tem erro, ok?
Qualquer coisa escreva suas dúvidas aí nos comentários que eu farei o possível para te ajudar.
*************************
Caio Nascimento... Você precisará editar as imagens. A que vai aparecer no post, basta você diminuí-las para o tamanho desejado (photoshop ou fireworks são os recomendados :) )
Se você entende de HTML, você pode montar seu álbum só no código (tem um exemplo no post... Qualquer coisa: código fonte ;) )
Ou se não, no blogger mesmo, coloque para alinhar as imagens lado-a-lado.
Para visualizar o tamanho real na hora do clique é fácil, basta hospedar as imagens no tamanho real desejado, ok?
************************
Valeu Rafael... :) Boa sorte meu camarada!
Muito bom o tutorial meu velho! Gostei muito, mas estou com um problema grande! Logo que instalei as lightbox ocorreu tudo certo, mas derepente não abre mais as imagens como lightbox, elas abrem no final da página, nem sequer dentro de nenhuma box, apenas no fim da página como se fizesse parte da mesma, o que tem de errado? Veja o link: www.meustudiodigital.blogspot.com
Abração!
Eu teria que saber alguns detalhes Danilo, para poder te ajudar.
Como por exemplo, onde você está hospedando os arquivos do plugin. Desde já eu indico o Ripway.
Refaça o tutotrial novamente usando o Ripway... Qualquer dúvida é só perguntar!
Flaa ae Brother Voltei, fiquei um tempo sem net e sem mexer no blog logicamente, Intao Alem das Imagens Funciona com Textos Tbm ? Se você tem que ter o link da imagem, no caso eu teria o link do Texto sera que daria certo ? Abraço!
Fala aí Brenner!
Rapaz, para você ter uma ideia, eu já vi videos do youtube abrindo com esse plugin (tipo, clicando na imagem e abrindo o video).
E já vi textos também. Mas ainda não testei nenhum dos dois.
Já é uma boa ideia explorar essas duas possibilidades, não? Qualquer coisa eu atualizo o post. Ou se você quiser, dando certo sua experiência, relate aqui pra gente nos comentários! :)
Abraço!
Ae Leandro, consegui cara, porem tem que istala ele, vamo troca uma ideia a respito disso ? Velho e MUITOOOOOOOO MASSA!
Olá Brenner!
Eu acabei de ver o seu "Continue lendo". A caixa que se abre com o texto. Imagino que era o que você desejava, certo?
Vamos trocar uma ideia sim. Deixa seu hotmail aqui nos comentários, ou se preferir me mande pelos contatos que eu te adiciono, beleza?
Abraço e parabéns cara! :) Ficou muito bom!
O meu deu certinho, hospedei as js no Google Site e deu certo, funcionando um pouco quanto pesado na hora de buscar as imagens mas ficou bem legal...
Convido para visitarem meu blog.
Abraços vlw Leandro!
BEC Fotografia
www.becfotografia.blogspot.com
Olá BEC!
Ficou show a galeria! Uma dica para ela ficar mais leve com menos imagem?
Crie mais páginas para essa mesma galeria e embaixo coloque o link para cada página, tipo:
1 | 2 | 3 (E por aí vai)...
Parabéns pelo Blog e sucesso!
Cara,
Simplesmente parabéns!
Essa postagem me ajudou pra caramba! Já sou um pouco familiarizado com os códigos HTML, CSS etc., mas estava batendo cabeça para instalar essa ferramenta no meu blog (www.PSekiMG.Blogspot.com - Em Construção)!
Fazendo tudo o que você disse e hospedando os arquivos no Ripway... É 100%!
Até mais.
OLá PSekiMG!
Rapaz, fui informado que o site do Ripway foi hackeado. :(
Não estou comletamente ciente dos problemas... Mas desde já vou retirar minhas recomendações e trocar os meus arquivos que estão hospedados por lá.
Leandro, fiz todos os passos mas estou com alguns problemas ainda.
Eu clico na imagem, ela carrega o lightbox mas não abre a imagem!
Poderia me ajudar? Passa seu msn e a hora que vai estar online qualquer coisa.
Abraços!
João Jorge... Tente hospedar sua imagem em outro lugar.
As vezes, quando hospedado no próprio blogger (e não fazendo algumas modificações no código) acontece isso mesmo.
Olá amigo, fiz um blog hospedado no blogspot com o lightbox e ficou perfeito até eu colocar um dominio proprio e o lightbox parar de funcionar, será que pode me ajudar?
www.itapuanews.com
Olá Ivan!
Como você pode reparar, o meu lightbox não está funcionando. =/
Mas imagino que seja algum problema na migração dos arquivos do Google Pages para o Google Sites.
Quando a mudanç para um domínio próprio, creio que isso não afete em nada o funcionamento do plugin.
oi cara seguir seu conselho e hospedei em outro lugar o skydrive e voltou a funcionar, só que com uma lentidão danada, vc conhece algum lugar onde eu possa hospedar este arquivos?
Olá Ivan... Rapaz, eu usava o Ripway. Mas ele tinha sido atacado por hackers.
Caos vc queira dar uma conferida para ver se está tudo ok.
Como você pode reparar, eu continuo usando o Google Sites. Horas funciona o plugin, horas não. =/
Surgindo algo melhor eu irei divulgar aqui. Mas por enquanto é isso.
valeu cara parece que agora está resolvido, com sua ajuda se quiser dar uma olhada www.itapuanews.com
Ripway, né Ivan? :)
Parece que deram um jeito por lá então.
Google sites tem um sério problema com hospedagem de certos arquivos.
(CSS e SWF... Já tive e tenho problemas com esses 2 arquivos)
Que bom que tenha dado certo contigo!
Vi seu Blog... Ficou massa!
Abraço!
Um ótimo plugin - um lightbox reformulado - que talvez você consiga fazer isso é o prettyPhoto.
Segue o link abaixo:
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/#_api
Quando ao bug que está acontecendo com Henrique, já aconteceu com outras pessoas.
Tente mudar os códigos. O que está no HTML passar para o painel de layout (HTML/javascript) e vice-versa.
Galera, essa dica pequei no Blog Vagabundia.
Para hospedar arquivos com extensão js, basta substuí-la por txt.
lightbox.txt.
Quando referenciar tem que trocar também a extensão;
Ex.:
...s r c = Link (caminho) do código hospedado prototype.txt type=text/text
Ola, quero agradecer a ajuda por esse tutorial, que por sinal é ótimo! Mas tenho uma dúvida. As imagens quando clicadas abrem em outro browser. Nao era pra clicar e expandir na mesma tela? Grato, aguardo resposta, ok!!
Olá Edvaldo!
O efeito é exatamente como você mencionou.
O exemplo do post está funcionando... O problema é onde eu hospedei os arquivos.
De vez em quando o host fica congestionado e acaba que o plugin não funciona corretamente (as vezes).
O que você pode fazer é encontrar um host mais confiável. ;)
Abraço!
ola leandro... Acho q fiz tudo certinho, mas demora mto para abrir e as imagens nem estão tão pesadas. Fiz o teste com suas imagens, no código q colocou lá em cima e só abriu a do coringa.
Tem alguma dica para abrir mais rápido.
obrigada e parabens pelo tutorial.
bjo
Olá Patrícia!
Eu acabei de entrar lá na página de exemplo e as imagens abriram todas numa boa (menos uma, pois deve ter dado algum problema ou deletaram a imagem no local onde a hospedei).
Olha Patrícia... No meu caso, eu hospedei os arquivos no RipWay. Não é 100% certo, mas vem se mostrando o melhor local para hospedar os arquivos. Agora uma dica:
Caso queira deixar as imagens no Blogger mesmo, vá em (na postagem) Editar HTML e no código da imagem que vocâ acabou de carregar, procure por:
s1600-h, retire o –h.
Olá Leandro, gostei muito do seu tutorial, mas estou com um problema.
Na hora de hospedar as 4 linhas finais, não consigo achar a opção "adicionar um Gadget HTML/javascript" no blogger. Só aparece "adicionar Gadget" e quando clico aparecem gadgets prontos, sem opção para utilizar html nem java
O que faço??
Então Caio... Após clicar em Adicionar um Gadget, procure (nesses 'gadgets prontos') por HTML/javascript.
Depois é só colar os códigos lá dentro e pronto, ok? :)
Abraço!
Opa! Muito obrigado! Já consegui, logo vou postar as fotos, valeu mesmo! Sucesso! ^^
Abraço
Ah, mais uma coisa, é muito admirável a sua disposição pra ajudar, mesmo depois de 2 anos ainda está aqui respondendo as dúvidas, parabéns! Difícil achar pessoas assim hoje em dia!
Valeu Caio!
É prazeroso ajudar pessoas que passaram pela mesma dificuldade que eu tive.
Uma vez ou outra costuma aparecer um mala (que eu costumo ignorar), mas na maioria das vezes são pessoas bacanas!
E eu quem agradeço pela sua visita e comentário!
Abraço!
Oi consegui colocar no meu blog, porém em meu blog também tem uma apresentação de slides em javascript e quando coloco este album de fotos a apresentação de slides e os seguidores somem. vou colocar um link de uma imagem para você ver como fica. Meu blog ainda esta em contrução e ainda não esta no ár.
Link do Blog Sem o Codigo do lightbox:
http://i45.tinypic.com/j0v1n8.png
Link do Blog com o codigo do lightbox:
http://i47.tinypic.com/axywzn.png
Obs: Já coloque este codigo em varios lugares diferente do blog até nas postagens e sempre aconteceu a mesma coisa. Na segunda imagem voce pode perceber os links das fotos ao lado da caixa de pesquisa.
desde já adradeço.
Olá Thyego!
Rapaz, já me reportaram sobre esse conflito do plugin quando se tem outros códigos javascript no Blogger.
Você já tentou colocar os códigos (tantos do plugin quanto dos slides) no painel Layout? (Adicionar Gadget - HTML/javascript) Ou alternar um no HMTL mesmo e outros no painel Layout?
Essa é umas das possíveis soluções... Caso não dê certo, o que vc pode tentar é usar um outro programa de slids ou até mesmo outro plugin semelhante ao lightbox, ok?
Qualquer coisa é só perguntar!
Abraço!
Olá Leandro, Obrigado pelas dicas em seu blogger.
Fiz o efeito tão desejado. Agora acho que está demorando a abrir as fotos.Têm como abrir mais rápido?E outra pergunta, é possível criar o efeito lightbox dentro de iframe?
attt, Robson
Blz cara...
Eu criei o java porem nao sei como posto igual o exemplo que vc deu da imagem que abre sem sair do blog...vc pode me ajudar.?
Olá!
O problema pode ser onde você está hospedando os seus arquivos. Leia alguns comentários anteriores (ou no post mesmo), pois dessa forma você encontrará umas dicas de hospedagrm, ok?
-----------------------
Olá Robson. (não sei pq, mas seu comentário não apareceu)
Talvez o problema da demora seja pq as imagens estão muito pesadas. Qualquer coisa, você pode editá-las para ficarem mais leves.
Agora a pergunta: Elas demoram a aparecer, mas uma hora acabam aparecendo ou não?
Abraço!
Leandro, valew pelo tuto....
mas, infelismente o meu não rolou. segui a risca mas não tive o efeito desejado.
vc tem msn pra gente trocar uma ideia ou vc só presponde por aqui mesmo?:
abração
Olá Neimar!
Eu respondo só por aqui mesmo, até para ajudar outras pessoas que talvez estejam com a mesma dúvida.
Para começar Neimar, hospede seus arquivos no Ripway. O Google Sites vem apresentando problemas quanto aos arquivos ".CSS".
Depois de hospedados os arquivos faça um teste.
Lembre que a página tem que está totalmente carregada para assim você clicar na imagem e ver se o plugin está funcionando corretamente.
Abraço!
Leandro, valeu pelo codigo...precisei de um hj e achei o seu..bem explicado e tudo certinho...valeu...
estou usando o google sites e toda vez que preciso dele pra hospedar .js e outros...ele funciona bem, não sei qual o problema do pessoal ai acima...o que acontece eh que so dá pra pegar o link pela pagina de arquivos e copiando o link do DOWNLOAD e apagando o final da url ate a extensão do arquivo..pelo menos eu uso assim...
ainda não coloquei meu album em funcionamento mas logo logo usarei...
abraços...
Del Vieira
zumbilizando.blogspot.com
Olá, Leandro!
Minha dúvida é:
No meu blog tem vários lugares onde posso adicionar gadget - header, sidebar, footer... - posso colocar em qualquer um, ou tem um local específico pra adicionar o gadget?
Prestei bastante atenção a todos os detalhes, principalmente na hora de fazer as alterações e uploads; inclusive hospedei todos os arquivos no RipWay, mas não estou tendo sucesso. Qdo clica nas thumbs, abre como uma imagem normal, e não no lightbox...
vc pode me ajudar a resolver isto? o meu blog é www.ministerioredencao.com
Ae Leandro... ontem tirei um tempo e resolvi estudar o Lightbox e consegui obter o resultado.
só não consegui colocar as imagems lado a lado.
veja vc mesmo:
http://rockonline4all.blogspot.com/p/fotos.html
abração
Neimar
Eu estou com um probleminha aqui, Eu não sei onde coloco os códigos, eu coloquei todos no Gadget JavaScript/HTML, mais não é isso, aonde coloco esses códigos, já fiz todos eles, só não sei onde coloca-los.
Obrigado.
Amigo,Boa Noite.me ajude por favor,fiz todo o processo que vc explica e por sinal muito bem explicado,mas infelizmente também não tive sucesso,hospedei os arquivos no ripway,fiz as modificações e tudo mas e nada.quando clico na foto ela aparece lá no imageshack mais sem o efeito que tem a sua ai no seu blog,o que pode está acontecendo? acredito que o meu blog não está reconhecendo estes arquivos me ajude por favor gostei muito deste lightbox e preciso realmente que ele funcione no meu.Muito obrigado e sucesso
Valeu Del Vieira! :)
---------------
Olá Leo Pessoa Jr.
A sua primeira pergunta a resposta é sim. Você pode colocar flash em qualquer lugar.
Quanto a sua outra dúvida, espere a página toda carregar antes de clicar na imagem. Isso é necessário.
-------------
bazzareletro, você precisa pegar o link direto da imagem.
O link que você está pegando é o que aparece noimageshack. Olha lá direitinho que você encontrará o link certo.
Leandro, que estranho.... o meu parou de funcionar. eu não mexi nos codigos nem nada... simplesmente parou. minhas fotos estão hospedados no eu servidor q tenho na insite.... será q tem algo a ver? outra coisa, como eu faço pra deixar os thumbs lado a lado no post? como um album?
abracao
Neimar... Você hospedou o CSS no Ripway, certo?
Olha só, reparei algo.
No Google Sites, o CSS não funciona (coloquei o CSS do meu blog e simplesmente o blog abria sem formatação. E o lightbox também não funcionava).
Com o Ripway ok. Mas reparei que as vezes o meu lightbox também não funciona. Mas só que depois de entrar na minha conta do ripway e abrir o CSS do plugin para conferir se estava tudo bem, o efeito do lightbox voltava a funcionar no blog.
Eu vou procurar um lugar um pouco melhor para hospedar os arquivos. Encontrando atualizo o post.
Os thumbs (caso vc tenha editado e deixados com tamanhos reduzidos) para deixar lado a lado você tem duas opações.
Ou ir upando na parte dos posts no Blogger e ir colocando lado a lado (movendo para a esquerda) ou criando uma tabela em HTML e fazer tudo manualmente (usando td e tr).
Po Leandro eu hospedei td na insite... eu tenho uma conta lá... 60 gigas de espaço. funcionava td muito bem e derrepente parou. vou refazer td o preocesso de novo.
Neimar, to tendo o mesmo problema...semana passada upei no google sites os arquivos (com as devidas modificações), inseri o codigo no meu blog e testei algumas imagens...BLZ..funcionou tranquilamente..hj, fui implementar no blog da minha empresa com o mesmo codigo do meu blog e ñao tah funcionando...ja refiz, não adiantou...
sabe se eh algum tipo de erro, leandro? prq o codigo tah correto.
Abraços.
Del Vieira.
Não tenho muito o que falar sobre isso, pois tive o mesmo problema que vocês e depois que mudei para o ripway, o problema meio que amenizou.
É aquele negócio, infelizmente ainda hoje em dia usar serviços gratuitos tem suas desvantagens.
(Se bem que o Neimar está usando um serviço pago :( )
Funcionou, parabéns.
Tenho uma duvida, usei o codigo para carregar uma imagem
Assim que a imagem é carregada, temos ao lado direito o botão "XCLOSE" é possível neste código colocar o nome da imagem para que possa aparecer ao lado esquerdo do botão xclose?
É possível fazer algumas modificações sim.
Basta você querer se aventurar no código javascript e CSS do plugin.
Leandro, hoje em dia é difícil ver um blogueiro que dá atenção igual você. Eu tive algumas dúvidas em alguns recursos no blogger, porém para ajudar alguns blogueiro cobravam pelo PagSeguro.
Por isso que eu fiquei encantado com a sua gentileza de responder a todas as perguntas.
E se tiver um tempo sobrando e puder me ajudar: consegui hospedar os arquivos, já usei esse código do LightBox em outros blogs meus, porém no meu blog principal o efeito não fica legal. O fundo escurecido só fica em uma parte da tela, na parte direito fica claro. Você poderia me ajudar?
Olá (novamente :) ) Pedjah!
Primeiramente, valeu pelas palavras. E igual a você, também me cobraram por uma informação.
Na época fiquei tão puto que resolvi a questão sozinho e depois disponibilizei o tutorial aqui no blog.
Mas vamos então a dúvida:
O fato do plugin ter funcionado em seus outros blogs já descarta qualquer erro no passo-a-passo. Ótimo!
Geralmente acontece esse tipo de erro quando o blog já possui linhas de código em javascrit (ex. Quando se instala outros plugins ou gadgets no blog).
Na verdade nem é erro, e sim conflitos de código.
Experimenta - caso seja esse o caso - retirar nem que seja provisóriamente algum gadget ou plugin que você tenha instalado.
Não dando certo, volta aí que a gente tenta resolver isso de outra maneira.
Abraço!
Po cara fui hospedar no pages creator mas nem rolou...
Google Page Creator is no longer accepting new sign-ups.
Voce aconselha algum outro lugar?
Olha... Se o Google Sites não apresentasse alguns problemas com o arquivo CSS seria uma boa.
Mas você pode ir de Ripway: http://www.ripway.com/
OI.. o botão de CLose não tá funcionando.. o que eu faço?
bjs
Eu não sei onde você está hospedando seus arquivos (incluindo as imagens), mas experimenta hospedar em outro lugar (pelo menos a imagem GIF do 'close').
Qualquer coisa é só perguntar! ;)
Aleluia!!!!
Depois de muitas e muitas tentativas - acho que já faz mais de 1 ano que venho tentando colocar esse recurso no meu blog -, finalmente consegui!!!
Confesso que já estava desistindo de vez!!!
Muito... muito... mas muito obrigada, Leandro! Nossa! Pareço uma tonta, de tanta felicidade!!! kkk
O que eu estava fazendo errado:
1) Hospedando no Dropbox, daí eu mudei para o Ripway
2) Usando os links de imagens minhas que já estavam no blog, daí eu hospedei as imagens no Ripway e deu certo!
A única coisa que não consegui, foi abrir o "lightbox.js" para alterar as imagens... Maaaasss... Mesmo assim eu amei o resultado final, ficou exatamente do jeito que eu queria!
Grande abraço e mais uma vez, obrigada!!!
Daniele Pimenta
Montréal/Canadá
Hahaaaaaa!!!
Consegui colocar o ícone para fechar a janela!
Êta "minina" perseverante!!! kkk
Eu não tinha conseguido abrir o arquivo "lightbox.js", pq eu não desmarquei a opção "Sempre usar esse programa para abrir esse arquivo". Depois que eu desmarquei, consegui abrir com o WordPad, fiz as modificações, hospedei novamente e... Voilà! Agora ficou PERFEITO!
Grande abraço!
Daniele Pimenta
Beleza Daniele! =D
Que bom que tenha conseguido colocar o plugin para funcionar.
Estou tendo uns problemas com o ripway que não está abrindo uns arquivos.
(Lá vou eu procurar outro lugar para hospedá-los. E que com certeza não será o skydrive, pois meu arquivo flash do banner só funciona um dia e depois para ¬¬ )
Abração... Qualquer coisa estamos aí!
Pessoal... Encontrei um site que aceitou bem a hospedagem de arquivos ".swf".
Basta agora saber se ele também aceitará arquivos ".css" e ".js".
Farei mais uns testes. E dependendo dos resultados atualizo o post.
Abraços!
No caso... O site é esse: Free Webs
Bom dia Leandro. Estou com um conflito aqui no meu blog e ñ consigo resolver por nda! Já pesquisei em td q é lugar (rsrs). É o seguinte, tenho um slide no blog chamado: AnythingSlider (ex: http://css-tricks.com/examples/AnythingSlider/). Só que, qndo eu coloco o efeito lightbox no blog, o slide para de funcionar e somente o lightbox funciona. Será q vc tem alguma idéia? Desde já agradeço.
Olá Gleison!
Aqui mesmo nos comentários eu já conversei com pessoas que tiveram o mesmo problema de conflito.
Existem outros plugins semelhantes ao lightbox que você poderia testar. Infelizmente não tenho o tutorial de nenhum outro. :(
Caso eu encontre alguma solução, atualizo o post, ok?
Abraço!
Olá Leandro, bom dia! Ok.
Andei lendo os comentários, mas são tantos a respeito deste plugin q confesso q ñ li tdos. Mas blz, vlw pela ajuda e se eu encontrar algo semelhante eu posto aqui blz?
Abraço e t+.
Valeu Gleison! :)
Olha só... Eu cheguei até a começar a fazer um tutorial desse plugin semelhante ao lightbox:
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/#_api
Infelizmente, após algumas formatações e backups, eu não sei exatamente onde esse tutorial se esconde em meu computador.
Mas fica aí então o link como sugestão.
Abraço!
Man... funcionaou tudo perfeitamente
Excelente tutorial, parabéns.
Funcionou perfeitamente e o resultado foi ótimmo
Ótimo tutorial!
Já fazia bem tempo que estava tentando colocar essa opção no blog a qual eu administro, mais todas as tentativas sem sucesso!
Mais desta vez, Graças a Deus, e a sabedoria que Deus lhe deu para você criar este tutorial, conseguir colocar o efeito LightBox no blog.
Aqui, muito obrigado, e te parabenizo pelo seu empenho em ajudar ao próximo, parabéns cara!!!
Deus continue te abençoando mais e mais!
Abraços!
Sou eu quem deve agradecer pelas palavras. =D
Obrigado pela visita e comentário.
E seja sempre bem-vindo!
Olá amigo fiz tudo o que você ensinou e funcionaou perfeitamente! No entanto o efeito só funciona mesmo quando eu estu logado no blog, mas quando entro sem logar ao clicar na imagem ele abre uma outra página. Qual o problema?
Depende...
Às vezes o lugar onde você hospeda a imagem tem influência.
Outra... O efeito só funciona depois que a página toda é carregada.
blz! Vou verificar!!!!!
Prlblema resolvido meu caro! Hospedei os arquivos das imagens (closelabel, nextlabel...) juntamente com os arquivos css e js no ripway e o problema foi resolvido, inclusive o carregamento da página está aparentemente mais rápido! obrigado pela rara atenção e prestatividade... Deus te abençoe!
Amigo ficou uma dúvida. O código para eu chamar as imagens eu coloca na postagem mesmo? Se for como faço? Ou no código do Gadget?
Grato
Olá amigo.
Estou tentando colocar esse efeito, porem no meu blog (que já possui uma template) a foto nao fica totalmente por cima. Tenho uma banner e um video na barra lateral, e quando clico na foto, a foto nao aparece por cima destes. Alguma dica ?
Obrigado
Ae Cara gostei do tuto
To com uma duvida; Coseguir fazer tudo fiz funcionar so que os botões de next e prev Estao se repitindo varias vezes queria saber porque ta repitindo e no codigo tá no-repeat
Boa Tarde!
Eu tenho um blog que a pouco comprei um domínio.
Como utilizo de fotos configurei o lightbox nele e ficou ótimo.
Porém eu hospedo no ripway... e desde ontem não está no ar e pra ajudar está falhando algumas imagens que não estão aparecendo.
E tentei utilizar outro navegador (Firefox) e nem abre as fotos.
Resolvi hospedar minhas fotos em outro site, pois necessito delas no ar.
Acabei de utilizar o google sites....mas ele funciona só no firefox e não no IE.
Por favor, me ajude estou em prantos...
Tentei outros que hospedam tb... que vc citou acima mais não deu certo...
O que pode estar acontecendo para as imagens não aparecerem em tds os navegadores? Pelo menos no IE e no Firefox...
Obrigada....ficarei no aguardo de sua resposta.
Erika Dias
Erika... O Google Sites é um serviço muito bom. O que pode ter acontecido (já aconteceu antes) é o sistema estar em manutenção e ter ficado fora do ar por um tempo.
Mas tem um outro serviço que eu uso e que nunca me deu dor de cabeça que é o http://www.webs.com/.
Experimenta lá!
Os browser nao têm nada a haver com a hospedagem! Se nao dá em um browser é culpa do programador ou melhor é culpa do browser sinceramente eu como programador posso lhe dizer que o IE é uma ******************** seja lá o que for não presta!
Ola Leandro Ricardo.
COnseguir perfeitamente colocar o lightbox em meu blog.
Mas eu to querendo colocar tambem, um banner(imagem) que abre automaticamente assim que entramos no blog tipo esse aqui: http://www.forexpros.com.pt/
Se puder me ajudar agradeço.
email para contato: empreendedor20@hotmail.com
E ai Leandro blz? o download ñ esta funcionando.
conserta ai na moral.
vlw
Bruno
Olá Bruno!
Rapaz, o site está fora do ar, né?
Vou ver o que posso fazer.
De repente devo ter o arquivo (um pouco modificado) aqui no PC.
Se encontrar outro link eu atualizo já.
Ola Leandro, poderia responder se vc pode me ajudar com o meu problema?
Mas eu to querendo colocar tambem, um banner(imagem) que abre automaticamente assim que entramos no blog tipo esse aqui: http://www.forexpros.com.pt/
ola aonde você hospeda os arquivos ?
Postar um comentário