Tutorial: Como adicionar uma caixa pop-up de curtir do Facebook em um blog no Blogger com JQuery

  • Autor Autor JuanDRomero
  • Data de início Data de início
Este tópico foi traduzido automaticamente do espanhol. Ver original
Bom, não sou especialista, mas lendo um pouco consegui fazer. Uma vez li que se você tem scriptaculous ou algo assim, davam problemas com jquery ou se você tinha duas versões diferentes deste último. Também deveria colocar o blog onde você está fazendo, talvez algum blogueiro mais experiente possa te ajudar.
 
Última edição:
muito obrigado, me serviu bastante já que eu estava procurando há bastante tempo,

Abraços e obrigado 😉
 
Guardado em tutoriais...

mais tarde vou colocar em prática.. estou configurando outras coisas 🙂
 
eu tenho essa xP
 
Muito obrigado, bom tutorial :encouragement:
 
muito obrigado amigo, abraços
 
olá amigo, em que parte devo colocar este código no blogger
antes de ]]></b:skin>

antes de </body>

antes de </head>
 
pergunta, esse popup aparece mesmo se o navegador tiver o bloqueio de popup ?
 
Vamos em: Design / Elementos da página / HTML/Javascript:

- - - Atualizado - - -

pergunta, esse popup aparece mesmo se o navegador tiver o bloqueio de popup ?

Nunca vi esse problema. mas seria bom que outra pessoa comente sua experiência.

- - - Atualizado - - -

olá amigo, em que parte devo colocar este código no blogger
antes de ]=]=></b:skin>

antes de </body>

antes de </head>

Vai aqui amigo: Design / Elementos da página / HTML/Javascript:

ou seja, como se você adicionasse um gadget
 
vocês sabem como adaptar para que eu pudesse colocar um iframe de outra coisa diferente nesse popup?

muito obrigado.
 
parece muito bom, mas pessoalmente acho muito invasivo para os visitantes, abraços!
 
olá amigos, eu tenho um mais simples e que é o que utilizo no meu site extreme pc futbol aqui deixo o código para colocar antes da etiqueta </head>

<link href='http://dl.dropbox.com/u/62785484/scripts/shadowbox.css' rel='stylesheet' type='text/css'/>
<script src='http://dl.dropbox.com/u/62785484/scripts/shadowbox.js' type='text/javascript'/>
<script type='text/javascript'>
Shadowbox.init({
overlayColor: &quot;#000&quot;,
overlayOpacity: &quot;0.6&quot;,
});
</script>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script type='text/javascript'>
// <![CDATA[
Shadowbox.init({
language: "es",
players: ['html']
});
function AlertMessage()
{
Shadowbox.open({
player: 'html',
content: 'Colocar o iframe da sua fanpage facebook, também podem colocar vídeos ou qualquer outro código html aqui',
height: 300, // Altura da janela modal
width: 500 // Largura da janela modal
});
}
setTimeout('Shadowbox.close()', 10000);
window.onload = AlertMessage;
// ]]>
</script>
</b:if>

estava me esquecendo de alguns efeitos extras que podem dar às suas entradas, artigos ou publicações com este pequeno truque

imagens:
<a href="URL da imagem" rel="shadowbox" title="Imagem">Imagem</a>

Galeria de imagens:
<a href="URL da imagem" rel="shadowbox[galeria1]" title="Imagem">Imagem 1</a>
<a href="URL da imagem" rel="shadowbox[galeria1]" title="Imagem">Imagem 2</a>
podem adicionar a quantidade de imagens que vocês desejarem.

Vídeos youtube:
<a rel="shadowbox;width=405;height=340;" title="YouTube" href="http://www.youtube.com/v/CCwVb9Faxdc&amp;rel=0&amp;autoplay=1">YouTube</a>
Lembrem-se de substituir a url do vídeo pelo que desejarem colocar

vídeos vimeo:
<a rel="shadowbox;width=405;height=340;" title="Vimeo" href="http://vimeo.com/moogaloop.swf?clip_id=8711928&amp;autoplay=1">Vimeo</a>

Vídeo Google:
<a href="http://video.google.com/googleplayer.swf?docid=-1941725100819420671&autoplay=1&hl=es&fs=true" title="Vídeo Google" rel="shadowbox;width=405;height=340">Vídeo Google</a>

Arquivo SWF:
<a rel="shadowbox;width=400;height=300" title="SWF" href="URL do arquivo.swf">Animação SWF</a>

Página Web:
<a rel="shadowbox;width=700;height=500" title="Página web" href="URL da página">Página web</a>

Mapa:
<a rel="shadowbox;width=425;height=350" title="Mapa" href="URL do mapa">Mapa Google</a>

Nota: em alguns casos não serão mostradas imagens, apenas links de texto, se deseja que sejam mostradas imagens adicione o seguinte
<img style="width:150px; height:100px;" src="URL da imagem" />
, Substitua pelo que está sublinhado
espero que gostem
 
Última edição:
obrigado, mas não funciona para mim, dentro do body não tem que colocar nada? talvez porque coloquei no blogger, vocês acham ?



olá amigos, eu tenho um mais simples e que é o que utilizo no meu site extreme pc futbol aqui deixo o código para colocar antes da etiqueta </head>



espero que gostem
 
Última edição:
Excelente, gostei muito.
 
não, nada amigo, não tem que adicionar nada na etiqueta body, pois esse sempre passo para alguns amigos que desejam utilizar fanbox na página principal, e esta foi a primeira vez que me contam que não funciona, vou olhar para ver o que acontece, se foi que tive algum erro
 
Olá, se eu instalar não terei algum problema com o google ou adsense por ser um pop up ?
 
Muito boa contribuição, eu testei e funciona maravilhosamente..
 
era o que eu procurava, muito obrigado 😀
 
Voltar
Topo