Tutorial: Cómo agregar una caja emergente de Me gusta de Facebook a un blog de Blogger con JQuery

  • Autor Autor JuanDRomero
  • Fecha de inicio Fecha de inicio
Bueno no soy experto sino q leyendo un poco pude hacerlo, una vez lei que si tienes scriptaculos o algo asi daban problemas con jquery o si tenias dos versiones diferentes de este ultimo, Tambien deberias poner el blog donde lo estas haciendo talvez algun bloggero mas experimentado pueda ayudarte.
 
Última edición:
muchas gracias me sirvio bastante ya que lo andube buscando ya bastanate tiempo,

Saludos y gracias 😉
 
Guardado en tutoriales...

luego lo pondre en practica.. ando configurando otras cosas 🙂
 
yo tengo esa xP
 
Muchas gracias, buen tutorial :encouragement:
 
muchas gracias amigoo saludos
 
hola amigo en que parte se debo colocar este código en blogger
antes de ]]></b:skin>

antes de </body>

antes de </head>
 
pregunta, este popup sale aunque el navegador tenga el bloqueo de popup ?
 
Vamos a: Diseño / Elementos de la página / HTML/Javascript:

- - - Actualizado - - -

pregunta, este popup sale aunque el navegador tenga el bloqueo de popup ?

Nunca he visto ese problema. pero seria bueno que otra persona comente su experiencia.

- - - Actualizado - - -

hola amigo en que parte se debo colocar este código en blogger
antes de ]=]=></b:skin>

antes de </body>

antes de </head>

Va aca amigo: Diseño / Elementos de la página / HTML/Javascript:

osea como si agregaras un gadget
 
conoceis como adaptarlo para que yo pudiera meter un iframe de otra cosa diferente en ese popup?

muchas gracias.
 
se ve muy bien, pero personalmente lo encuentro muy invasivo para los visitantes, saludos!
 
hola amigos yo le tengo uno mas sencillo y que es el que utilizo en mi sitio extreme pc futbol aquí les dejo el código colocar antes de la 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 el iframe de su fanpage facebook, tambien pueden colocar videos o cualquier otro codigo html aqui',
height: 300, // Alto de la ventana modal
width: 500 // Ancho de la ventana modal
});
}
setTimeout('Shadowbox.close()', 10000);
window.onload = AlertMessage;
// ]]>
</script>
</b:if>

me olvidaba de algunos efectos extras que le pueden dar a sus entradas, artículos o publicaciones con este pequeño truco

imagenes:
<a href="URL de la imagen" rel="shadowbox" title="Imagen">Imagen</a>

Galeria de imagenes:
<a href="URL de la imagen" rel="shadowbox[galeria1]" title="Imagen">Imagen 1</a>
<a href="URL de la imagen" rel="shadowbox[galeria1]" title="Imagen">Imagen 2</a>
pueden añadir la cantidad de imagenes que ustedes desen.

Videos 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>
Recuerden reemplazar la url del vídeo por el que deseen colocar

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

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

Archivo SWF:
<a rel="shadowbox;width=400;height=300" title="SWF" href="URL del archivo.swf">Animación SWF</a>

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

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

Nota: en algunos casos no se mostraran imagenes solo enlaces de texto, si deseas que se muestren imagenes agrega lo sigueinte
<img style="width:150px; height:100px;" src="URL de la imagen" />
, Reemplazalo por lo que esta subrayado
espero les guste
 
Última edición:
gracias, pero no me funciona, dentro del body no hay que poner nada? tal vez porque lo puse en blogger, creeis ?



hola amigos yo le tengo uno mas sencillo y que es el que utilizo en mi sitio extreme pc futbol aquí les dejo el código colocar antes de la etiqueta </head>



espero les guste
 
Última edición:
Excelente me gusto mucho.
 
no nada amigo, no hay que agregarle nada en la etiqueta body, pues ese siempre se lo doy a algunos amigos que desean utilizar fanbox en pagina principal, y esta a sido la primera vez que me cuenta que no le funciona voy a mirar para ver que sucede si fue que tuve algún error
 
Hola, si lo instalo no tendre algun problema con google o adsense por ser un pop up ?
 
Muy buen aporte lo eh probado y funciona de maravilla..
 
era lo que buscaba, muchas gracias 😀
 
Atrás
Arriba