Fanbox para Facebook, Twitter, y Google Plus, flotantes y con efecto deslizante

6 de enero de 2013 631 comentarios ,
AVISO
La API de Twitter cambió y ahora requiere autenticación para obtener los datos de los seguidores, por tal motivo éste y los demás fanbox para Twitter han dejado de funcionar. Si me entero de una solución u otra alternativa lo publicaré de inmediato.


Hace algún tiempo vimos cómo poner el fanbox de Facebook flotante y con efecto deslizante. En esa ocasión usamos un plugin de jQuery que aunque es bueno tiene la desventaja que la versión gratuita sólo permite poner una pestaña nada más, además que quienes usan otras librerías tenían problemas de compatibilidad.

En esta ocasión lo haremos sólo con CSS, de manera que no utilizaremos ni un solo sript y podremos mostrar no sólo una sino tres pestañas, el fanbox de Facebok, el fanbox de Google+, y el fanbox de Twitter.
Puedes ver un ejemplo en esta misma entrada, lo verás del lado derecho de la ventana.

Bien, para poner estos fanbox flotantes en el blog sólo tenemos que ir a Diseño | Añadir un gadget | HTML/Javascript y ahí pegar el siguiente código:
<style>
#flotante1 {
position:fixed;
top:100px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1002;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante2 {
position:fixed;
top:240px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1003;
border-radius:10px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante3 {
position:fixed;
top:380px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1004;
border-radius:10px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante1:hover, #flotante2:hover, #flotante3:hover {
right:0px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
div.likeboxwrap {
margin-top:-5px;
margin-left:-45px;
width:238px;
height:325px;
background-color:#fff;
overflow:hidden;
border-radius:10px;
}
</style>

<!-- Primera pestaña -->
<div id='flotante1'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTgRukQd720EChdF_38xk4QjH0GpjDWeLkjonRV23xDSpFdSFSSqlsqO0G-X_bOb9acoGRobGGsrMA1aBUXtNmXvWBq88pJQSXzh6QOh6XDuRYmTGAKoPtgmyc2GfDJY0ssWSiCISk4UM/' style='float:left;'/>
<div style='background: #3c5a98; height:325px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap'><iframe allowtransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fnombre-de-la-página-de-facebook&width=240&colorscheme=light&connections=15&stream=false&header=false&height=350' style='border:none; overflow:hidden; width:240px; height:325px;'/></iframe>
</div></span></div></div>

<!-- Segunda pestaña -->
<div id='flotante2'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmesHO6_XXXXDNfdBXMkv-qrh6xu7_F08wKRvjdbtK66RzazgsRk5RYUdBfe6eDv-H_vBTd9aifRsBoaXy3etJdF2Wqqg0gmTCeV-9afZBvfG6XCqWwDPcraPrVB2ubGtuzCTbGWiEzwI/s159/goo_tab.png' style='float:left;'/>
<div style='background: #9A9FA8; height:325px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap' style="padding-left:20px; padding-top:15px; height:310px !important;">

<div class="g-plus" data-action="followers" data-height="300" data-href="https://plus.google.com/XXXXXXXXXXXXXX" data-source="blogger:blog:followers" data-width="240">
</div>
<script type="text/javascript">
(function() {
window.___gcfg = {'lang': 'es'};
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>

</div></span></div></div>

<!-- Tercera pestaña -->
<div id='flotante3'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJAy6QLOHM6AHBvbMALikBsrwyASQkjsVRJdCgrrm1olhQO0_44Ks9o2bgHj7mQArE_Q5DyGAcL_w18FdcF8hiFrH3BDzMOvxEmIud6zgKFs_fmDu26qAxugqf6oZHCG7pcOwL5m2ncaA/' style='float:left;'/>
<div style='background: #00a0e8; height:325px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<style>
.follow_box_widget{overflow: hidden; padding-left: 5px; padding-right: 5px; padding-top: 5px; background-color: #fff transparent; position: relative; margin: auto;}
.follow_box{font-size: 11px; font-family: "lucida grande",tahoma,verdana,arial,sans-serif; color: #333; line-height: 1.28; text-align: left; direction: ltr;}
.follow_box .follow_top{padding: 5px 10px 0px 5px; margin-bottom: 8px; min-width: 230px; overflow: hidden;}
.follow_box .profileimage{float: left; width: 40px; height: 40px; padding: 0px; margin: 0 10px 4px 0;}
.follow_box img{border: 0;}
.follow_box a{cursor: pointer; color: #3B5998; text-decoration: none;}
.follow_box a:hover{text-decoration: underline;}
.follow_action{padding: 0 0 0 8px;}
.follow_box .follow_action .name{line-height: 15px; font-size: 14px; font-weight: bold;}
.follow_box .follow_button{margin: 5px 0 0;}
.follow_box .total{min-width: 230px; overflow: hidden; display: block;}
.follow_box .connections{padding: 5px 0 4px 0px; border-top: solid 1px #D8DFEA; border-bottom: 1px solid #CCC; min-height: 150px;}
.follow_box .connections .connections_grid{padding-top: 5px; overflow: hidden;}
.follow_box .clearfix{zoom: 1;}
.follow_box .connections .connections_grid .grid_item{float: left; margin:0px; margin-right: 5px; margin-bottom: 8px; overflow: hidden; width: 50px;}
.follow_box .connections .connections_grid .grid_item .name{font-size: 9px; color: gray; overflow: hidden; padding-top: 2px; text-align: center; white-space: nowrap;}
.follow_box .connections .connections_grid .grid_item img{width: 48px; height: 48px;}
.follow_box .follow_widget_footer{ cursor: default; width: 100%; min-width: 230px; overflow: hidden;}
.follow_box .footer_border{ margin-top: 5px;}
.follow_box .uiImageBlock{line-height: 14px;}
.follow_box .follow_widget_footer .footer_logo{float: left; margin-right: 5px;}
.follow_box .follow_widget_footer .footer_text{cursor: default; color: #808080; font-size: 9px; float: left;}
.follow_box .follow_widget_footer .footer_text a.footer_text_link{color: #808080;}
.follow_box .titlecase{text-transform:capitalize;}
</style>
<script>
/*
* Twitter Follow Box jQuery Plugin
* http://jobyj.in/twitter-follow-box-widget/
* Copyright 2012, Joby Joseph
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
(function(a){a.fn.followbox=function(b){function f(a,b){if(a>100)a=100;var c=new Array;for(var d=0;d<a;d++){c.push(b[d])}var e=c.join();return e}var c=a(this);var d="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigolp7j3OEz7dRoD3pbIS6q9Q7762W2LCjCPtcnjtklpUcgdepxGN0j42Rv5IC4XSSmcMrpgF2B7t-xvi6j3VD74lgBtVndE-hdqopLs5pAeIoOrWJG4HuMRwQVwnR_wSWu5Mo4XZz5do/";var e=a.extend({user:"jobysblog",width:292,height:252,theme:"light",border_color:"#AAA",bg_color:"#fff",bg_image:"",title_color:"#3B5998",total_count_color:"#333",follower_name_color:"#BBB"},b);a.ajax({url:"http://api.twitter.com/1/users/lookup.json?screen_name="+e.user+"&include_entities=true",dataType:"jsonp",success:function(b){var g=e.width-2;var h=e.height-2;var i=e.height-115;var j=parseInt(e.width/55);var k=parseInt(i/69)+1;var l=j*k;c.html('<div class="follow_box_main" style="border: 1px solid #bbb; width: '+g+"px; height: "+h+'px;"><div class="follow_box_widget"><div class="follow_box"><div><div class="follow_top clearfix"><a href="http://www.twitter.com/'+e.user+'" target="_blank"><img class="profileimage img" src="'+b[0].profile_image_url_https+'" alt="'+b[0].name+'"></a><div class="follow_action"><div class="name_block"><a href="http://www.twitter.com/'+e.user+'" target="_blank"><span class="name titlecase">'+b[0].name.toLowerCase()+"</span> @"+b[0].screen_name+'</a></div><div class="follow_button"><iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name='+e.user+'&show_count=false&show_screen_name=false&lang=es" style="width:100px; height:20px;"></iframe></div></div></div><div class="connections"><span class="total"><span class="follow_box_follower_count">'+b[0].followers_count+'</span> personas siguen a <b class="titlecase">'+b[0].name.toLowerCase()+'</b></span><div class="connections_grid clearfix" style="height:'+i+'px;"></div></div></div><div style="height: 23px"><div class="follow_widget_footer"><div class="footer_border"><div class="clearfix uiImageBlock"><a class="footer_logo" target="_blank" href="http://jobyj.in/twitter-follow-box-widget"><img src="'+d+'"/></a><div class="footer_text"><a class="footer_text_link" target="_blank" href="http://jobyj.in/twitter-follow-box-widget">Twitter Social Plugin</a></div></div></div></div></div></div></div></div>');if(e.theme=="dark"){c.find(".follow_box_main").addClass("dark")}c.find(".follow_box_follower_count").text(c.find(".follow_box_follower_count").text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g,"$1,"));if(a.browser.msie&&!a.support.boxModel)a(".follow_box .connections").css("padding-bottom","14px");if(e.theme=="custom"){c.find(".follow_box_main").css({"border-color":e.border_color,"background-color":e.bg_color,"background-image":'url("'+e.bg_image+'")'});c.find(".follow_box a").css({color:e.title_color});c.find(".follow_box .total").css({color:e.total_count_color})}a.ajax({url:"https://api.twitter.com/1/followers/ids.json?cursor=-1&screen_name="+e.user,dataType:"jsonp",success:function(b){var d=f(l,b.ids);a.ajax({url:"https://api.twitter.com/1/users/lookup.json?user_id="+d+"&include_entities=true",dataType:"jsonp",success:function(b){for(var d=0;d<b.length;d++){var f=a.trim(b[d].name);var g=f.split(" ");var h='<div class="grid_item"><a href="http://twitter.com/'+b[d].screen_name+'" target="_blank"><img class="img" src="'+b[d].profile_image_url+'" alt=""><div class="name titlecase">'+g[0].toLowerCase()+"</div></a></div>";c.find(".connections_grid").append(h)}if(e.theme=="custom"){c.find(".connections .connections_grid .grid_item .name").css({color:e.follower_name_color})}}})}})}})}})(jQuery)
</script>
<script>
$(document).ready(function(){
$('#twitterfollowbox').followbox({
'user':'usuarioTwitter',
'height':'300',
'width':'260',
'theme':'custom',
'border_color':'#ffffff',
'bg_color':'#ffffff',
'bg_image':'',
'title_color':'#3B5998',
'total_count_color':'#333333',
'follower_name_color':'#BDBDBB'
});
});
</script>
<div id="twitterfollowbox" class="follow-box-container"> </div>

</div></span></div></div>
Agrega donde se indica el nombre de tu página de Facebook, también pon la ID de tu página de Google Plus en donde están las equis en rojo, y el nombre de tu usuario de Twitter también donde se indica en color rojo.

El ID de tu página de Google Plus lo puedes ver ingresando a tu página, y al final de la URL aparecerán una serie de letras y números, ese es tu ID.

En el caso del fanbox de Twitter hemos usado el fanbox para Twitter que vimos recientemente, pero puedes usar otro, o bien, quitar la pestaña, o sustituirla por otro contenido, pues al menos ese fanbox sí usa jQuery y puede causar incompatibilidad con otros scripts.

En caso de que quieras cambiar alguna pestaña por otro tipo de contenido tendrás que localizar la URL de la imagen de la pestaña (color azul) y sustituirla por la que diseñes, luego quitar el contenido de la pestaña (según sea el caso) y en su lugar poner el código que desees.

La ventaja de este método es que no usamos scripts para las pestañas, ni para esconderlas, ni para mostrarlas, ni para el efecto deslizante. La contra es que el efecto deslizante son transiciones con CSS por lo que los navegadores que no son modernos no podrán ver el efecto de deslizamiento. Fuera de esto último es un método que además de ser fácil de aplicar también es una buena opción para tener tus distintos fanbox agrupados y mostrándolos de una forma elegante y original.




ACTUALIZACIÓN 1:
Si el fanbox de Facebook te marca error puede ser porque aún no tienes una URL personalizada en tu página de Facebook, en esos casos deberás cambiar esta parte:
http%3A%2F%2Fwww.facebook.com%2Fnombre-de-la-página-de-facebook
Por esta:
http%3A%2F%2Fwww.facebook.com%2Fpages%2Fnombre-de-la-página-de-facebook%2FXXXXXXXXXXXXXXX
Ahí además de poner el nombre de tu página donde se indica deberás poner en las equis una serie de números que aparecen al final de la URL de tu página de Facebook.

ACTUALIZACIÓN 2:
Es preciso mencionar nuevamente que el fanbox de Twitter sí usa jQuery por lo que si ya tienes alguna versión de jQuery o si usas otra librería de scripts como Scriptaculous entonces no se verá, en esos casos habrá que eliminar la versión de jQuery que incluye el gadget y/o hacer unos cambios para que sea compatible con Scriptaculous. Para más información mira la entrada sobre el fanbox de Twitter.


631 comentarios en:

" Fanbox para Facebook, Twitter, y Google Plus, flotantes y con efecto deslizante "

  1. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  2. Hola potro , Excelente post , tenia el tabview que tambien lo hise gracias a tu y lo voy a cambiar por este ....

    cambiando el teman xD , en tu respuesta me dijisrte que no podia poner l imagen de la peli con los botones debaje , me podrias decir que podria hacer para postear las pelis y preferiblemente que no ocupara tanto espacio , o que sea similar a lo que te demostre ......

    Gracias por todo

    ResponderEliminar
    Respuestas
    1. Busca una plantilla similar a ella, hay algunas en la red que son dedicadas para blogs de películas. Google casi siempre tiene la respuesta para todo ;)

      Eliminar
  3. Hola,lo he puesto en mi blog y queda muy bien,pero me gustaria ponerlo a la izquierda se puede?

    ResponderEliminar
    Respuestas
    1. Este comentario ha sido eliminado por el autor.

      Eliminar
    2. Hola, para ponerlo del lado izquierdo tendrías que hacer una nueva imagen para cada pestaña pues están orientadas del otro lado, luego tendrías que cambiar todos los right del primer código (de los estilos) por left
      Y cambiar los style='float:right;' que están en los códigos de las imágenes de las pestañas por:
      style='float:left;

      Eliminar
    3. Lo decia porque tengo las flechas de subir y bajar en el lado derecho y una imagen,pero las puse a la izquierda y ahora ya se ve bien,gracias por responder :)

      Eliminar
  4. Muy buena idea Potro, la verdad que es un efecto muy bueno y ordena un poco el tema de seguimiento. Lamentablemente he notado que interfiere con cualquier otra aplicación de jquery que tengas funcionando. Por ejemplo la flecha de http://ciudadblogger.com/2012/03/boton-ir-arriba-con-jquery-que-aparece.html y otras que uno tiene por allí, dejan de funcionar.

    Un abrazo

    ResponderEliminar
    Respuestas
    1. Es porque el gadget de Twitter usa jQuery, mira esa entrada, ahí hay algunos enlaces que te ayudarán a resolver el problema.

      Eliminar
  5. Gracias por la info, de verdad es muy úttil...

    ResponderEliminar
  6. Feliz Año Potro y Bienvenido al 2013, al nuevo mundo de los zombie ♥
    por un momento creí que te había secuestrado papa Noel ^^

    Precioso Tema, ajja me encanto.
    Besiñus y Moltos Saluttes!!

    ResponderEliminar
  7. Wow!, está genial esto, lo probaré en seguida en mis blogs. Muchas gracias por el aporte Potro =)

    ResponderEliminar
  8. Excelente Potro!, son geniales y excelentes las ventajas de usar CSS!, por cierto a ver que te parecen estos efectos CSS: http://www.ajaxshake.com/es/JS/1181/css.html
    Saludos!

    ResponderEliminar
  9. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
    Respuestas
    1. Hola Taen Ogma, son dos problemas en tu caso, tienes varias versiones de jQuery y además usas Scriptaculous. Aunque las pestañas como tal no usan ninguna de estas librerías, el fanbox de Twitter sí, incluso en la entrada sobre ese fanbox se menciona. Estos enlaces te podrán servir:
      http://ciudadblogger.com/2011/10/jquery-sus-versiones-y-el-conflito.html
      http://ciudadblogger.com/2011/02/usar-jquery-y-scriptaculous-al-mismo.html

      Pd. He eliminado el comentario por el aviso que está al final.
      Saludos.

      Eliminar
  10. en internet explorer da problemas por que partadea y no deja mostrar y seguir una pagina

    ResponderEliminar
  11. potro como hago para agregar en vez de twitter, el widget de:

    Participar en este sitio
    Google Friend Connect

    Todos los miembros (4795)

    es que no tengo cuenta de twitter y no quiero una.

    ResponderEliminar
    Respuestas
    1. El de Google Friend Connect ya no se puede añadir en gadgets HTML/Javascript, si el de Twitter no te sirve puedes quitarlo.

      Eliminar
  12. Hermano Hermano Eres EL MEJOR Sin duda alguna hehe, busque esto durante 6 meses por cientos de blog y hoy entro a mi blog favorito y lo encuentro hehe eres el mejor de seguro que sÍ lo eres Muchas Gracias te deseo lo mejor para CIUDAD BLOGGER ;)

    ResponderEliminar
  13. Hola Potro. He hecho todo lo que pones pero no me redirecciona bien a mi página de Facebook. Tiene que ser un user? o puede ser una página? En tal caso...estoy copiando mal en nombre de la página? también hay que poner la ID?

    Un saludo y enhorabuena por la idea, está de lujo ;)

    ResponderEliminar
    Respuestas
    1. Hola Juan José, lo que sucede es que todavía no tienes una URL personalizada para tu página de Facebook, en esos casos debes cambiar esta parte del código:

      http%3A%2F%2Fwww.facebook.com%2Fnombre-de-la-página-de-facebook

      Por esta:
      http%3A%2F%2Fwww.facebook.com%2Fpages%2Fnombre-de-la-página-de-facebook%2FXXXXXXXXXXXXXXX

      Ahí además de poner el nombre de tu página donde se indica deberás poner (donde están las equis) una serie de números que aparecen al final de la URL de tu página de Facebook.

      Eliminar
    2. Gracias Potro! solucionado! =)

      Eliminar
  14. Por mucho que intento no consigo que salga el del facebook. saludos.

    ResponderEliminar
    Respuestas
    1. Hola Xosé, si estás poniendo la URL de renato.nunez entonces no funcionará, el fanbox de Facebook es sólo para páginas y no para perfiles.
      Saludos.

      Eliminar
  15. Estimado Ciudad blogger, Este post me ha sido muy útil ya que mi plantilla no funcionan los que se deslizan al bajar la pagina.

    ¿Porque hay beces que la pestaña de twitter se queda en blanco cuando uno la habre? Bueno, no se si es solo en mi ordenador...

    Y gracias por tus famosas entradas, para mi es el sitio mas facil de aprender.

    ResponderEliminar
    Respuestas
    1. Puede ser porque ese fanbox usa jQuery, o porque algunas veces no está disponible el servidor de Twitter desde donde se leen los datos. Mira la entrada sobre el fanbox de Twitter, ahí se mencionan esos puntos.

      ¡Saludos y muchas gracias por tu comentario!

      Eliminar
  16. Me gustó!!! Lo pondré al tiro en mi blog. ¡Gracias Potro! :D

    ResponderEliminar
  17. ¡Gracias Potro! Es genial. Lo voy a poner en mi blog. Es elegante y muy práctico. ¡Gracias de nuevo!

    ResponderEliminar
  18. Feliz año y gran aportación para la comunidad. Ya que estamos de pestañas, e podria incluir los seguidores de blogger?

    ResponderEliminar
    Respuestas
    1. Noup, el de los Seguidores ya no se puede meter dentro de gadgets HTML :(

      Eliminar
  19. Ya estoy yo aquí jeje Lo del Face no me sale ¿No tomo bien la dirección? ¿Que es en concreto lo que tengo que poner? Que zoquete soy jajaja

    Feliz años Potro
    Saludos

    ResponderEliminar
    Respuestas
    1. Jajaja, zoquete no lo creo ni tantito ;)
      ¿Cuál es la URL que quieres poner de Facebook?

      Eliminar
  20. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
  21. Esta excelente, pero no visualiso en tu blog el de twiter! estoy por cambiar la plantilla asi q en unos dias lo pongo en mi blog para ahorrar espacio. Gracias!

    ResponderEliminar
    Respuestas
    1. A veces no se ve, todos los fanbox para Twitter que conozco tienen ese pequeño defecto, que por ratos no se ven :(

      Eliminar
    2. Ahora con Mozilla si lo veo, y no me aguante a esperar plantilla ya lo coloque en mi blog ;) grande potro!

      Eliminar
  22. se ven excelentes tengo pusto solo de facebook pero voy a probar estos gracias

    ResponderEliminar
  23. Una pregunta?
    coloque el usuario de twitter y este no medio
    el de facebook todo bien el de google + lo omití

    ResponderEliminar
    Respuestas
    1. Tendría que verlo puesto, entré al blog de tu perfil pero sólo veo el de Facebook.

      Eliminar
  24. ¡Feliz Año a todos!

    Potro ¿respondes a problemas surgidos en blogs por e-mail?
    De ser asi... me gustaría saber tu e-mail para contactar.

    Gracias de antemano

    ResponderEliminar
    Respuestas
    1. Ya no Eruanne :( todas las consultas son por aquí en el blog, en la entrada reacionada con el problema que tengas o con la que más se le asemeje.

      Eliminar
  25. Respuestas
    1. Casi. casi. Faltaría el de Seguidores pero ese cada vez se queda más en el olvido, hasta yo apenas lo recuerdo :P

      Eliminar
  26. Y si tengo Scriptaculous? Funcionará...? O como sería el Código?

    ResponderEliminar
  27. (No se si se publico mi otro comentario)

    Si tengo Scriptacolous instalado funcionara? o ... Cual seria el Codigo?

    ResponderEliminar
    Respuestas
    1. Las pestañas sí, pero el fanbox de Twitter posiblemente no, a menos que apliques un cambio que se explica en la entrada del fanbox de Twitter.

      Eliminar
  28. Potro de corazón esta super super. Me interesa colocarlo pero solo el de facebook y el de twitter. Además los coloque y el de twitter sale en blanco, hay algún problema...

    ResponderEliminar
    Respuestas
    1. Hola Jose, mira la entrada sobre el fanbox de Twitter, eso resolverá tus dudas.
      Saludos!

      Eliminar
  29. Potro este truco puede demorar la carga del blog?

    ResponderEliminar
    Respuestas
    1. Las pestañas por sí solas no, el contenido de ellas podría ser, depende de qué tanto tengas en tu blog.

      Eliminar
  30. bien implementado, ya lo habia visto en un sitio en ingles de trucos para blogger.
    saludos,

    ResponderEliminar
    Respuestas
    1. Luego me pasas el link, a ver si les copio algo XD

      Eliminar
    2. Jejeje estuvo bueno ese... que mal agradecidos...

      Eliminar
  31. ezcelente idea me encanta la pondre a prueba. Buena manera para empezar el año. Saludos :D

    ResponderEliminar
  32. Hola Potro! Feliz año! ¿Se puede poner en el margen de abajo en vez de en el margen derecho?

    Gracias de antemano!!

    ResponderEliminar
    Respuestas
    1. Posiblemente sí aunque no lo he probado de esa forma, sería cuestión que jugaras con los valores de right: y los cambies por bottom:
      También tendrías que crear nuevas imágenes para las pestañas y hacerlas de forma horizontal en vez de vertical. Será cuestión de experimentar.

      Feliz año para ti también :)

      Eliminar
  33. Hola!

    Tengo un problema que no tiene nada que ver con el contenido de esta entrada pero necesito información y ayuda sobre el tema de los dominios. El caso es que ayer he comprado un dominio, he recibido los dos correos, el segundo de Google Apps con un enlace para crear una cuenta de administrador, pero al poner el nombre de usuario, la contraseña y darle a "proceder con la configuración" me da error del servidor...
    No sé si es que aún tengo que esperar más tiempo pero por favor me podéis ayudar con este asunto.
    Gracias de antemano!

    ResponderEliminar
    Respuestas
    1. Hola Mariem, como nunca he comprado un dominio desde Blogger no sé qué problemáticas pueda dar, yo te sugiero que revises los correos que te dieron por si tienen un correo de asistencia o quizá en el Foro de Ayuda de Blogger sepan decirte qué está pasando.

      Saludos.

      Eliminar
  34. Hola Potro!
    Nuevamente consultandote este año :)
    Hoy tenia un mensaje de google:

    Publicar recursos de una misma URL
    Hemos analizado algunas de las páginas de sus sitios que publican la mayoría de los anuncios y hemos detectado problemas de velocidad de página que crean una experiencia muy negativa para algunos usuarios. Las páginas que se visitan con frecuencia en sus sitios muestran el mismo recurso desde varias URL, con lo que malgastan ancho de banda y recursos del cliente. Obtener información sobre cómo corregir este problema.

    Lo revise y vi la información para corregir el problema pero era como si me estuvieran hablando en chino :( no se que hacer, espero puedas ayudarme!

    Mil Gracias!
    Saludos
    Monica

    ResponderEliminar
  35. Potro se mee olvido colocarte el link que me dan sobre la "información para corregir el problema", es este https://support.google.com/adsense/bin/answer.py?hl=es&utm_medium=link&utm_campaign=ww-ww-et-asfe_&utm_source=aso&answer=1663759

    gracias ;)

    ResponderEliminar
    Respuestas
    1. Hola Mónica, casi todo lo que podría decirte se menciona en ese artículo, supongo que tendrás que trabajar en la velocidad de carga del blog, en caso de que tengas imágenes súbelas desde Blogger o directo desde Picasa. Si tienes varios scripts alójalos en la plantilla preferentemente, y de ser posible elimina todo lo que no te sea verdaderamente útil.

      Saludos.

      Eliminar
  36. Listo... ya los puse en mi pagina y quite los viejos, ahorran espacio y son mas rapidos.

    Mira el resultado final.
    http://starbluecomics.blogspot.mx/

    ResponderEliminar
  37. Hola potro, interesante estas pestañas. Me han gustado.

    Por arriba lei que daba problemas con jquery, yo lo he probado en wordpress, no lo he implementado en blogger y la verdad que no me ha creado ningun problema con otros elementos jquery.

    ResponderEliminar
    Respuestas
    1. No se da ese problema en todos los casos, por suerte el tuyo es uno de esos casos en los que no hay ningún conflicto :)

      Eliminar
  38. Hola muy buena tu pagina, soy medio nuevo en esto del blog, el tema es que copio eso y me sale la pestaña pero en blanco, donde tengo que poner la direccion de mi pagina de Face (solo me interesa el face).
    Gracias

    ResponderEliminar
  39. Me gusta, pero puede haber problemas con el de twitter, yo tuve hace tiempo con uno de esos widgets, de todas maneras lo he colocado en el blog de pruebas a ver que tal.

    ResponderEliminar
  40. TODO ME SALE MENOS LO DEL TWITTER ALGUIEN QUE ME AYUDE??????

    ResponderEliminar
  41. Hola potro esta buenismi y nada sin problemas gracias.
    A proposito, queria consultarte 2 cosas, como son codigos te dejo la consulta en este txt.
    Un saludo y feliz año.

    ResponderEliminar
    Respuestas
    1. Hola Martin, el iframe para que no marque error conviértelo a texto plano. El anuncio que dices supongo que lo ideal es que solicites uno que no tenga efectos, o bien, eliminando el archivo jquery-1.7.2.min.js deberá quitarse también cualquier efecto con él.

      Eliminar
    2. Gracias potro, probe lo de pasarlo a texto plano pero me sigue tirando ese error que te comente, hay alguna otra solucion o algun caracter a sustituir en el iframe para que lo tome?
      Saludos potro!

      Eliminar
    3. El problema es la URL, como contiene caracteres especiales no reconoce esos caracteres como códigos válidos y por eso marca error. Yo siempre lo resuelvo convirtiéndolo a texto plano, no sé si igual sirva cambiando esa URL por una acortada.

      Eliminar
    4. Probe con tu conversor potro pero igual me da problema en el _size no se si habra otra forma. muchas gracias igual potro un saludo.

      Eliminar
    5. Prueba con otro:
      http://www.blogcrowds.com/resources/parse_html.php

      Eliminar
  42. MMMM no se que estoy haciendo mal, la pestaña de face me sala en blanco al igual q la de twitter
    http://enredandomelosdedos.blogspot.mx/

    ResponderEliminar
  43. No me sale. ¿Por qué? e_e La puse, pero no se ve nada en las pestañas.

    ResponderEliminar
    Respuestas
    1. Sin saber en cuál blog lo has puesto me es imposible poder ayudarte.

      Eliminar
  44. Vaya, yo debo ser muy torpe (y también soy nueva en los post claro) pero cuando voy a diseño/añadir gadget/ no me sale la opción de HTML sólo me sale "lo básico", "Más gadgets", y "Añade tu propio" y este último sólo es para meter una URL. buaaahhhhh, puedes ayudarme?

    ResponderEliminar
    Respuestas
    1. Hola Ana, dentro de "Lo básico" hay una lista de gadgets, ahí encontrarás la de HTML/Javascript.

      Eliminar
  45. No se que pasa que hago todo lo que dices y me sale la pestaña de facebook y todo, pero en vez de mi pagina aparece "Could not retrieve the specified page. Please verify correct href was passed in." Traducido: No se pudo recuperar la página especificada. Por favor, verifique href correcto se pasa pulg.
    La verdad me quedo igual, no se que he hecho mal, me podrias ayudar?

    ResponderEliminar
    Respuestas
    1. Habría que ver cuál es la URL que has puesto y el blog donde lo hiciste, pero no está de más que antes mires el comentario #14.1

      Eliminar
  46. Buen post y gracias Potro, lo estaba esperando desde al año pasado, ya lo tengo en mí blog.
    solo una pregunta ¿Qué parte del código tengo que cambiar para que en las casillas GOOGLE + Y TWITTER de mi blog digan "seguir" y no "follow". Quiero que sea como el tuyo en tu blog. Este es mi blog: ojoderojas.blogspot.com

    ResponderEliminar
    Respuestas
    1. Gracias efrain, copia de nuevo el código, ya lo he modificado para que aparezca todo en español.
      Saludos.

      Eliminar
  47. Funciona todo perfectamente menos el de twitter :/ no se por que coloco mi usuario donde me lo indica pero no no pasa nada isai_delosreyes no sale mi twitter y intente con otro el de twitter y tampoco salia nada o se que pasa lo estoy probando fuera de blogger en una aplicacion para crear paginas web sin escribir codigo Adobe Muse deberia funcionar perfectamente pero no es asi. Vista en vivo goo.gl/SZaNq

    ResponderEliminar
    Respuestas
    1. Sólo lo he probado en Blogger, desconozco cómo se comporte en otras plataformas. Tal vez quieras tomarlo desde la página del autor o ponerte en contacto con él por si continua el problema:
      http://jobyj.in/twitter-follow-box-widget/

      Eliminar
  48. Se ve a simple vista, pero no muestra los seguidores,de facebook y google, porque?

    ResponderEliminar
    Respuestas
    1. No sé en cuál blog lo has puesto, pero mira las actualizaciones que he publicado.

      Eliminar
    2. Otra pregunta ya solucione lo anterior, ahora quiero ponerlo poco mas arriba, el de twitter me queda muy debajo, casi esconde la mitad cuando se abre. Gracias por antemano por tu respuesta, El Potro, eres lo máximo

      Eliminar
    3. Cambia los valores de top que están en la primera parte del código, ahí controlarás que tan arriba se muestra cada uno de ellos.
      Saludos.

      Eliminar
  49. Maestreo ¡¡¡¡¡ Grande otra vez ¡¡¡ Me ha gustado mucho ya tengo el código implantado en mi blog, pero me pasa una cosa, ya tenía de antes tu fanbox de twitter, ya ahora me ha desparecido, creo por el color de fondo que es como si el del sidebar se hubiera convertido en flotante...en fin, misterios que sólo tu me puedes resolver. Te pegas un vistazo ?
    Gracias maestro y un saludo.
    http://www.barruntos.net/

    ResponderEliminar
    Respuestas
    1. Es porque aun conservas el código del otro fanbox y ese tiene la indicación de que tenga ese color de fondo. Debes quitar el otro código que tenías y dejar sólo este.

      Eliminar
    2. Tambien me paso lo mismo, tratare de corregirlo de esa forma..

      Eliminar
    3. Bueno te explico mejor.... elimine el fan box de twitter que tenia antes.... abri el nuevo para ver si hay algun error en el nombre de mi twitter, cuando le doy guardar me voy a mi blog y sale correctamente los seguidores, sin embargo; cuando recargo de nuevo la pagina vuelve a quedar el blanco.... no se que hice mal....

      Eliminar
    4. Tal vez sea lo que te mencioné antes. También puedes probar con las otras opciones de Fanbox para Twitter que hay.

      Eliminar
  50. Por fin Potro, la respuesta a Juan José me ha servido, ahora si
    Gracias

    ResponderEliminar
  51. Pero muchas gracias. ¡Me encantó! y ya lo uso.

    Me gustaría mucho implementarlo en LinkedIn. Es posible?
    O, usarlo para lograr seguidores en FB, twits en Twitter. Algún tip?

    ResponderEliminar
  52. Hola Potro.... en el caso de GOOGLE se debe abrir la pagina, no se puede hacer con el perfil de Google...???

    ResponderEliminar
    Respuestas
    1. Hola Luis Angel, no lo he probado con el de perfil, pero supongo que sí, es cuestión de que pruebes poniendo la ID de tu perfil en lugar del de tu página y ver el resultado.

      Eliminar
  53. POTRO SE QUE ERES MUY BUENO EN ESTE PERO CON ESTE CODIGO ME IMPRESIONASTE, LO MALO QUE NO PUDE PORQUE ME SALEN EN BLANCO LAS CAJAS SIN NADA :( ME PODRIAS GENERAR MI CODIGO? SI TU RESPUESTA ESTA ES MI PAGINA DE FACEBOOK https://www.facebook.com/pages/GTA-Mexican-Mod/425660684149113
    LA ID DE GOOGLE ES 102922677108834222162
    Y POR ULTIMO MI TWITTER ES https://twitter.com/Th3J3thro ESPERO QUE ME GENERES MI CODIGO POTRO TE LO AGRADECERIA DEMASIADO :)

    ResponderEliminar
    Respuestas
    1. Mira las dos actualizaciones que he publicado en la entrada.
      Saludos!

      Eliminar
  54. Hola Potro!! acabo de descubir tu blog y lo amo intensamente!!
    pero necesito ayudita, no he logrado que el fanbox de facebook me cargue correctamente!
    AYUDA PORFIS!!

    ResponderEliminar
  55. Hola Potro,interesante tu bloges bastante útil,aunque la verdad me pierdo un poco con el lenguaje,pues no sé lo que sob muchas cosas,yo de ordenadores navegar por internet y poco más.Me dijo mi hermana que hay sitios o maneras de que tenga más visitas un blog,y no solo porque guste.El mío lo tengo asociado a google mail,y quisiera saber que manera hay para aumentar mis circuloa para compartirlo con más gente,pues no me aparece como cuando di la cuenta de alta blogs para tenerlo en mis círculos,no me aparece una lista,ni una opción directa tampoco para seguor blpgs.También tal vez influya que normalmente entro desde el móvil y en ese formato no tenga tantas opciones.Espero que me puedas aclarar mis dudas,aunque sean un poco tontas. Este es mi blog por cierto:http://virgueriasilustradas.blogspot.com

    ResponderEliminar
    Respuestas
    1. Hola María. Sí puede ser que desde la versión móvil no veas todo el blog como normalmente se ve en la versión web, pero no es el caso de tu blog, sólo hay dos gadgets.
      Quizá lo que necesitas sería un gadget de suscripción por feed para que tus futuros lectores se suscriban y estén al tanto de tus actualizaciones:
      http://ciudadblogger.com/2011/05/crear-un-feed-en-feedburner-y.html

      Aquí unos tips para aumentar el número de suscriptores:
      http://ciudadblogger.com/2010/07/como-aumentar-el-numero-de-suscriptores.html

      Si tienes página de Facebook, página en Google+ (o perfil), y cuenta de Twitter, convendría que pongas algo como lo de esta entrada para que tus lectores te sigan, y desde esas redes sociales les hagas saber cuando publicas algo nuevo.

      Saludos.

      Eliminar
  56. Paso a agradecerte en este post por cierto buen aporte y muchas gracias por lo del fondo del menu me sirbio fantástico sos un genio y de nuevo muchas gracias potro sos el mejor (y)

    ResponderEliminar
  57. POTRO NECESITO AYUDA, NO PUEDO PONERLE EL DE TWITTER NI EL DE FACEBOOK AVER SI ME AYUDA PONGO EL USUARIO DE FACEBOOK Y EL DE TWITTER Y NO ME SALE NADA, EN EL DE FACEBOOK ME SALE ESTO:

    No se pudo recuperar la página especificada. Por favor, verifique href correcto se pasa pulg

    ResponderEliminar
  58. hola potro tengo un problema con el fanbox de Facebook flotante y con efecto deslizante. el facebbok no me funciona y el twitter tampoco y creo que lo hice bien a ver si me ayudas por favor. gracias

    ResponderEliminar
    Respuestas
    1. Hola ELOYDJ, no sé si ya has visto las actualizaciones que le hice a la entrada, eso resuelve (o ayuda a resolver) casi todos los problemas.

      Eliminar
  59. Hola potro te llego mi comentario? repente lo deje mal.
    un saludo!

    ResponderEliminar
  60. Me rindo! No se lo que debo estar haciendo mal pero la fanbox de Facebook,la única que quiero, me sale en blanco. Ante la desesperación he llegado a poner el de CiudaDBlogger y para mi sorpresa si que sale :°P Creo que lo he probado todo. Necesito tu sabiduría. El blog es: kalikafilmstv.blogspot.com y el Facebook es el del botón en el mismo blog. Gracias Potro.

    ResponderEliminar
  61. Buenísimo lo que lograste! vi otros que intentaron hacerlo pero siempre tenia algo que fallaba en las animaciones y el cambio de pestañas...
    Muchas gracias!! :D

    ResponderEliminar
  62. muy bueno gracias por la ayuda

    ResponderEliminar
  63. Hola Potro.
    Enhorabuena por tus post, los sigo siempre de cerca y me son de mucha utilidad. Es más la apariencia de mi blog en su mayor medida se lo debo a esta página que me ha ayudado mucho.
    Sin embargo tengo una consulta, me gustaría conseguir el efecto de este blog http://blog.justlove.ly/ Que la franja superior se quede siempre estática. Este es mi blog http://whereorwhat.blogspot.com.es/ y me gustaría aplicarle el mismo efecto. Gracias te antemano!

    ResponderEliminar
    Respuestas
    1. Hola whereORwhat, puedes poner una imagen flotante, así conseguirás un resultado similar:
      http://ciudadblogger.com/2009/03/poner-imagen-estatica-en-el-blog.html

      Eliminar
  64. Simplemente genial, eres un crack, pasar por mi blog para ver como quedó, saludos.
    http://trucosoutlook.com

    ResponderEliminar
  65. Hola potro..He instalado esto en mi Blog www.acerequebola.blogspot.com/ y se ve muy bien pero lo de facebook si te das cuenta no sale bien..no se que puede ser mi facebook tiene casi 8000 seguidores y no me sale ni uno en mi blog..este es mi página https://www.facebook.com/ConexionCubanos..Por favor si puedes ayudarme lo agradecería..saludos amigo

    ResponderEliminar
    Respuestas
    1. Hola Lizardo, yo veo otra página puesta en ese fanbox, una con 395 seguidores.

      Eliminar
  66. Hola potro, tengo un problema y es que al intentar añadir el gadget no me da la opción de html/javascript, solo me aparece por URL

    ResponderEliminar
    Respuestas
    1. Cuando se abra la ventana para añadir gadgets asegúrate que estés en "Lo básico", ahí hay una lista de gadgets donde encontrarás el de HTML/Javascript.

      Eliminar
  67. Hola Potro. Mi desesperación de ayer se ha convertido en alegría hoy. Como dije, soy muy cabezota y esperando tu ayuda al final he encontrado, eso creo, lo que estaba mal, si es que se puede decir así. Lo que intentaba poner es el nombre de un "perfil" de Facebook y no el de una "pagina" de Facebook. Abierta pagina, copiado el "nombre-de-la-página-de-facebook" y en mi caso mas el "XXXXXXXXXXX" y a funcionar. Con lo fácil que lo pones y el empeño que ponemos algunos en liarnos. Gracias.
    Ah, aprovecho, me aparece en la barra lateral derecha, donde he puesto el html del fanbox un recuadro vacío que se corresponde a este ultimo pues al darle al enlace de edición rápida se abre el susodicho html. Juraria que en un primer momento no aparecia el recuerdito, pero...aqui tienes de nuevo el enlace del blog: kalikafilmstv.blogspot.com.es

    Nunca me cansaré de repetirlo, ¡GRACIAS!

    ResponderEliminar
    Respuestas
    1. Es normal que aparezca, pero puedes arrastrarlo hasta abajo donde casi nadie lo vea ;)

      Eliminar
  68. !!Hola,Potro!!

    Quiero felicitarte por el estupendo blog que tienes,me ha ayudado en muchas ocasiones.Gracias por compartir tanta y tan buena información y por tu esfuerzo.Enhorabuena.Muchos besos,Potro.Buen finde.

    ResponderEliminar
    Respuestas
    1. Muchas gracias a ti por tu comentario y visita. Besos para ti también!

      Eliminar
  69. Hola.. Queria consultarte algo, descargue una plantilla y al final tiene lo siguiente:
    /*
    * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
    * Uses the built in easing capabilities added In jQuery 1.1
    * to offer multiple easing options
    * TERMS OF USE - jQuery Easing
    *
    */

    Es mas largo, pero la cuestión es que quería saber si puedo eliminar todo eso ya que creo que son solo comentarios, y si afecta en algo o no al tiempo de carga del blog, gracias

    ResponderEliminar
    Respuestas
    1. Hola, eso parece ser un plugin de jQuery, quizá es de algún efecto que usa la plantilla, así que si lo eliminas algo podría dejar de funcinoar.

      Eliminar
  70. hola feliz año.. me ayudarias a saber que pasa con el blog tuneandoelblog? me sale que es una página de peligro hice una captura, en dónde se la mando a ti o al usuario de ese blog para que esté enterado? ya que si me pasa lo mismo me gustaria que me lo hicieran saber no crees?
    p.d. no es necesario que publiques esta duda con me que me contestes me doy por satisfecho :) saludos

    ResponderEliminar
    Respuestas
    1. Gracias por tomarte la molestia. Yo no tengo su correo, pero sé que desde hace varias semanas (por la última entrada que publicó) que ya dejó el blog :s

      Eliminar
  71. Ola potro varias cosas:
    Primero como puedo poner esto pero quitando la de Google+ que mi blog no tengo esa red social
    Segundo como hago que en mi seccion de contacto poner un formulario para que la gente me mande al correo que yo quiere sus dudas sin tener que entrar en su correo
    Tercero me podrias decir algun sitio donde pudiera crear el logo para mi blog?
    Un saludo y gracias

    ResponderEliminar
    Respuestas
    1. Hola Tutto, en el código indica el inicio de cada pestaña, sólo localiza ese contenido y elimínalo si no lo deseas. Seguro necesitarás subir más la de Twitter así que bastará con que cambies el top que está dentro de #flotante3 {

      Para lo segundo, busca aquí en el blog "formulario de contacto", encontrarás unas tres opciones.
      Lo tercero te lo debo, pero seguro en Google lo encuentras.
      Saludos.

      Eliminar
  72. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
    Respuestas
    1. Hola Rodrigo, si crees que el problema ha sido por la plantilla yo diría que la pongas de nuevo (la que tenías) y que a partir de esa hagas los cambios que quieras para que se vea más o menos como la nueva. No siempre es problema de la plantilla, pero sí es una realidad que hay plantillas poco favorables para SEO que pueden afectar la cantidad de visitas que se reciben.

      He eliminado el comentario tal como me lo has pedido.
      Saludos.

      Eliminar
  73. Hola aqui otra vez, te cuento que lo coloque... me di cuenta que al principio se vieron mis seguidores de Twitter, pero luego el cuadro quedo en blanco... como lo resuelvo??

    ResponderEliminar
    Respuestas
    1. Podría ser por algún script que usas como el del chat, tal vez alguno de ellos también use jQuery. Prueba quitando la línea de jQuery y mira si eso lo resuelve.

      Eliminar
  74. Buenos días,

    Me gustaría que me ayudárais con la siguiente pregunta, he intentado dar de alta mi blog en Google Plus y, como no es una página personal, me dicen que no puedo darlo de alta. ¿Cómo lo habéis hecho vosotros?

    Gracias y saludos,

    ResponderEliminar
    Respuestas
    1. Hola Jose, sólo seguí los pasos de esta entrada, no hice nada más:
      http://ciudadblogger.com/2011/11/crear-una-pagina-en-google.html

      Eliminar
  75. Hola Potro! Quería hacerte una preguntita que no tiene que ver con la entrada... ¿Qué parte en el HTML de mi plantila tengo q cambiar para q en mis entradas el borde a izq y derecha d las imágenes sea igual a cero siempre? Debe ser una pavada pero no encuentro donde cambiarllo y me molesta hacerlo manualmente en cada entrada. Tengo una plantilla personalizada.

    Ojalá me puedas ayudar ;)
    Gracias y besos!

    ResponderEliminar
    Respuestas
    1. Hola Annie, habría que ver en cuál blog lo quieres hacer, pero usualmente sería algo así:

      .post img {
      margin-left:0;
      margin-right:0;
      padding-left:0;
      padding-right:0;
      }

      Eliminar
  76. a mi se me superpone el de facebook con otro escrip ¿se puede solucionar?

    ResponderEliminar
    Respuestas
    1. ¿Con cuál se suporpone? ¿en cuál blog?

      Eliminar
    2. el escrip Page Peel en este blog: http://vmglarevista.blogspot.com.ar/ (plantilla Fantástico, S.A)

      Eliminar
    3. No veo el Page Peel ahí, pero puedes bajar más las pestañas si lo deseas. En la primera parte del código verás tres valores dentro de top
      Esos valores son la distancia de cada pestaña desde arriba, si haces más grandes esos valores se moverán hacia abajo.

      Eliminar
  77. ¿Como se podría poner la pestaña para Tuenti?

    ResponderEliminar
    Respuestas
    1. Nunca he usado esa red Meri, desconozco si tengan fanbox y/o cómo implementarlo :/

      Eliminar
  78. Hola Potro buen día. hace tiempo quería preguntarte como puedo hacer en mi blog para que la imágen superior que tengo de portada en http://cinenewscine.blogspot.com/ unicamente se vea en la página principal y en las demás nooo.
    Saludos!

    ResponderEliminar
  79. Hola "El potro" quisiera hacerte una consulta este, vi en una pagina web que tenia anuncios a los costados de su web estáticos como para no romper las reglas de adsense.

    Me gustaría saber que hacer.

    Lo logre pero lo hice con div. flotantes estáticos pero cuando veía que solo en mi pc estaba bien puesto en otras se estaba tapando contenido y no era fijo en todas las web.

    Ayuda!

    Mi sitio es http://www.unadisco.com
    Ejemplo de la imagen de dejo el enlace
    http://s2.subirimagenes.com/otros/previo/thump_8233996adsen.jpg

    ResponderEliminar
    Respuestas
    1. Hola Milagros, cuando se usa la posición fija siempre es así porque la posición la toma de izquierda o de derecha en pixeles, así que si alguien entra con un monitor de resolución pequeña entonces este contenido puede sobreponerse. Ese es uno de los inconvenientes de la posición fija.

      Eliminar
  80. Potro, lo he puesto como para Facebook pero me sale la cajita en blanco Me figuro que habrá que ponerlo de otra manera me estoy refiriendo a TUENTI

    ResponderEliminar
    Respuestas
    1. El de Tuenti no lo conozco Meri, con ese no sé cómo ayudarte.

      Eliminar
  81. Hola, soy un poco desastre para estas cosas, menos mal que hay gente que ayuda como tú.. gracias.. He puesto la pestaña de facebook pero sale en blanco..

    ResponderEliminar
    Respuestas
    1. Gracias Sildan, mira la actualización de la entrada, tal vez eso pueda ayudarte. Si continuas con el problema dime dónde lo has puesto y cuál es la página de Facebook que estás añadiendo.

      Eliminar
    2. Gracias otra vez, sigo con el problema y ya he intentado un montón de cosas.. copio todo y pongo el nombre de facebook que cree el otro día y no sé si está bien ya.. sildan.sildan/5 aunque ya lo he puesto de mil maneras: sildan.sildan@facebook.com, sildan.sildan5\facebook.com, www.facebook.com/sildan.sildan/5 etc

      Graciass

      Eliminar
    3. Al final lo conseguí poner pero.. me salen fans repetidos..

      Eliminar
    4. Pues no es ninguno de esos, todos me dicen que no existe. Has esto, entra a tu página, copia la URL que aparece en la barra de direcciones y pegala aquí tal cual como está.

      Eliminar
    5. Si tienes pocos fans es normal que te aparezcan repetidos, cuando tengas más se normalizará el gadget.

      Eliminar
  82. Simplemente vengo a darte las gracias y a felicitarte. Tu página es lo mejor del blog Latino.

    Un saludo Potro.

    ResponderEliminar
  83. Hola, llevo poco tiempo con mi blog y ya soy una fan del tuyo. Es muy fácil implementar las mejoras que propones. Enhorabuena por tu trabajo! Lo último que he puesto son las pestañeas de la izda... Estoy encantada de mis progresos. Gracias!

    ResponderEliminar
    Respuestas
    1. Muchas gracias Nekane Bask, y bienvenida a Ciudad Blogger!

      Eliminar
  84. No funciona lo de twitter
    este es mi blog
    http://reflexionesylecturasparameditar.blogspot.com/

    ResponderEliminar
    Respuestas
    1. Potro he echo todos lo apsos y nada
      Visita mi blog a ver si puedes hacer algo por mi

      Eliminar
    2. ¿Y cuál blog debo mirar Ja Ar?

      Eliminar
  85. Excelente!!! Lo acabo de añadir en mi blog sin problemas!! Muchas gracias :)

    ResponderEliminar
  86. Hola, está increíble este widget, pero lo pongo en mi blog y no funciona. Ayuda, por favor!!! http://pianosheetsforfree.blogspot.com/

    ResponderEliminar
  87. perdona, de eso no me había dado cuenta, en ese caso, ¿cómo puedo hacer para que se vea en la página principal? yo no lo veo, solo en los posts.
    PS: gracias por responder tan rápido, realmente es bueno entrar a una página así :)

    ResponderEliminar
    Respuestas
    1. Es porque tienes una condicinoal que inidica que en la portada ese gadget y otros no se deben mostrar. Para resolverlo busca esta línea:
      .post-footer-line-1,.post-footer-line-2,post-footer-line-3,.post-footer, #sidebar-wrapper, #HTML1, #FollowByEmail1, #Label1, #Followers1{
      display:none;
      }

      Y cámbiala por esta:
      .post-footer-line-1,.post-footer-line-2,post-footer-line-3,.post-footer, #sidebar-wrapper, #FollowByEmail1, #Label1, #Followers1{
      display:none;
      }

      Eliminar
  88. Hola El Potro, exelente idea para promocionar nuestro blog en las redes sociales, yo la utilizare mas adelante cuando tenga mas seguidores, por lo menos que llenen la cuadricula jaja.

    Una pregunta: en mi blog (smsfan.blogspot.com) paso algo raro. Resulta que agrande la imagen del background de la fecha para que abarque toda la fecha porque no se mostraba y quedo bien pero ahora, al comenzar el mes de enero, el final de esa imagen no se muestra, pero en los demas meses si lo hace. Yo creo que sucede porque el nombre del mes es corto pero como lo soluciono?

    Gracias.

    ResponderEliminar
    Respuestas
    1. Hola JosecK, es porque las entradas son de la misma fecha, mira esta entrada:
      http://ciudadblogger.com/2010/11/mostrar-la-fecha-en-todas-las-entradas.html

      Eliminar
    2. Mmm, no me entendiste la duda. Presta atencion al background en la primera pagina del blog y luego miralo en las entradas antiguas. En las antiguas se muestra normal pero en las de enero no aparece el final del background. Me refiero a la entradas en las que se muestra la fecha.

      Eliminar
    3. Lee la entrada que te di, ese es el problema que tienes.

      Eliminar
  89. Potro, hoy como qué he estado haciéndote varias consultas.

    Aunque sé que esta no es la nota adecuada para hacerte la pregunta, también sé que por el formulario se tardaría mucho más, así que al grano.

    ¿Qué código puedo añadir a la plantilla HTML para que TODAS las imágenes de mi blog tengan el dobles, osea, el border-radious. Así no tendría que estar usando un editor todo el tiempo. Gracias de antemano.

    ResponderEliminar
    Respuestas
    1. La forma simple es así:
      .post img {
      border-radius:20px;
      }

      O algo más elaborado como esta entrada:
      http://ciudadblogger.com/2012/02/efectos-de-bordes-redondeados-en-las.html

      Eliminar
    2. Para comentar donde debo te escribo en la entrada a la que haces referencia. :)

      Eliminar
  90. Hola Potro!, quería darte las gracias por el gran apoyo que brindas a la comunidad, e invitarte a pasar por el blog: http://www.quesomos.com/ ya que sin vos esto no hubiera sido posible! Felicitaciones.

    ResponderEliminar
  91. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
    Respuestas
    1. Hola, procura usar minúsculas, en Internet escribir en mayúsculas significa estar gritando ;)
      Aun así creo que ya lo has resuelto pues veo funcionando el slider y las redes sociales.

      Elimino el comentario por el aviso que está al final.
      Saludos!

      Eliminar
  92. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
    Respuestas
    1. En data-height="300" puedes cambiar el alto y en data-width="240" el ancho.
      Elimino el comentario por el aviso que está al final.
      ¡Saludos!

      Eliminar
  93. potro tengo una duda como ago para ponerle sombras a una imagen dentro de la plantilla osea editando la plantilla necesito un codigo como el de de las letras

    text-shadow: #6374AB 10px -10px 3px;

    pero que sea para una imagen espero me puedas ayudar y saludos :)

    ResponderEliminar
    Respuestas
    1. Con box-shadow, por ejemplo:
      .post img {
      box-shadow: 10px 10px 5px #888;
      }

      Eliminar
    2. gracias potro me re sirbio una duda mas que me surgio cuando terminaba de diceñar las cajas de la entrada mira el limite del titulo es de 200px cuando los supera el resto del titulo de aparece abajo y eso como que queda mal quisiera saber si es posible hacer esto

      ejemplodeltitulolargo

      ejemplodelti...

      que quede puntos suspensivos al llegar al tope de escritura espero me puedas ayuda con este problemita y muchas gracias de nuevo saludos

      Eliminar
  94. Hola Potro, se que no viene al caso pero quería pedirte un favorcito, podrías echarle un ojo a mi blog y decirme como podría poner la foto de la cabecera mas pequeña o estrecha, para que al abrirlo ya se viera la parte de la entrada actualizada y no solo la foto?
    gracias de antemano
    Ana.

    http://www.triatlonenfamilia.com/

    ResponderEliminar
    Respuestas
    1. Hola ANA, tendrías que subir una foto con dimensiones más pequeñas, aunque eso haría que no cubra el ancho del blog.

      Eliminar
  95. Gracias Potro se ve muy elegante, como siempre sos el mejor.

    Hay problemas con el Internet Explorer, parpadea, en el firefox funciona bien, solo que el de twitter se queda en blanco en uno de mis blogs, en el otro si funciona bien.

    Bendiciones abundantes para este 2013

    ResponderEliminar
    Respuestas
    1. En IE no me extraña, lo extraño sería que todo se viera bien ahí :P
      En Firefox debe verse bien, sólo recuerda que a veces el gadget no está disponible (se menciona en la entrada del fanbox) así que puede ser que a veces se vea y por ratos no.

      Bendiciones para ti también.

      Eliminar
  96. Gracias Potro eres un genio, gracias me quedó bien bonito en mi blog, exelente.............

    ResponderEliminar
  97. Potro una consulta algo preocupante, mi Cuenta de Twitter fue Suspendida 1 semana despues de usar esto, ¿Crees que tubo algo que ver? no hice nada no hice Spam, ni nada la uso en mi blog http://www.fanaticosdelcaraudio.com

    ¿Tu que opinas? Gracias!

    ResponderEliminar

Si tu blog contiene material protegido por derechos de autor habilita tu perfil y deja únicamente el nombre de tu blog, no dejes la dirección del mismo, de lo contrario el comentario será eliminado.

Nota: solo los miembros de este blog pueden publicar comentarios.

 
Ir Arriba Ir Abajo
I Ciudad Blogger