2 jun 2011

Cómo poner el botón +1 de Google en el blog



Como sabes, el botón +1de Google permite al usuario marcar como recomendado el contenido mostrado en tu blog o web. Estas recomendaciones se mostrará en los resultados de las búsquedas en el buscador Google a partir del martes 28 de Junio de 2011 de manera global.

Para recomendar debes haber iniciado sesión en Google y el perfil asociado a tu cuenta debe ser público. Es evidente que este botón compite de manera directa con el mundialmente conocido "Me Gusta" de Facebook. Sin embargo, el botón de Google tiene un peso muy importante ya que favorecerá el posicionamiento de los sitios recomendados. Por lo tanto atentos no solo los Bloggers sino también los WebMasters.

Si como usuario marcas este botón, estas recomendado con 1 voto el contenido. Si lo vuelves a pulsar, quitas el voto. También puedes gestionar tus votos desde tu perfil público. El efecto que quiere conseguir Google es..."que mejor recomendación, que la que te hace un amigo"

Antes de continuar te invito a ver el siguiente video de apenas 1 minuto donde se muestra el funcionamiento de este nuevo botón que sin duda inundará todo Internet. Activa  los subtitulo en español pulsando el botón CC en la barra de reproducción.

Video de cómo funciona el botón +1 de Google:





Pasos para poner el botón +1 de Google en el blog (Blogger):

Existen dos métodos y debes elegir la que más se ajuste en tu caso.

Método 1. Usando los botones de compartir

Para aquellos blogs (no es mi caso) que no tienen botones personalizados como los que aparecen en este blog al pie de cada entrada, hay una forma muy sencilla y es habilitar los botones de compartir por defecto de las nuevas plantillas de blogger.
  1. Habilitar los botones de compartir en cada entrada del Blog
    • Abre la pestaña "Diseño" 
    • En "Entradas del Blog" pulsar "Editar"
    • Marcar "Habilitar botones de compartir"
    • Guarda la plantilla y visualiza el blog
    • Debes ver bajo cada entrada la siguiente barra de botones: 

Nuevo botón +1 en los botones de compartir de Blogger

Método 2. Utilizando un código Javascript y personalizando la plantilla

Este es el método que he usando en iniciaBlog ya que desde que incorpore el botón de "Twittear", ya no muestro los botones de compartir de la plantilla (siempre me parecieron poco visuales).
  1. Código para la sección "Head" del blog
    • Abre la pestaña "Diseño" y luego "Edición de HTML"
    • Pulsa "Descargar plantilla completa" para hacer una copia de seguridad
    • Busca con ayuda del navegador (Ctrl F o Ctrl B) esta cadena </head>
    • Pega justo antes de la linea anterior el siguiente código:
      <!-- boton+1 de blogger -->
      <script lang='ss' src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
  2. Código del botón para situarlo debajo de cada entrada
    • Ahora buscamos esta cadena:
      • Para colocarlo al pie de la entrada: post-footer-line post-footer-line-1
      • Para colocarlo en la cabecera de la entrada: post-header-line 
    • Justo debajo pega este código:
      <g:plusone expr:href='data:post.url' size='medium'/>

      A partir del 25 de Enero de 2012, además si quieres mostrar las caras de las personas que han hecho clic en el botón añade el parámetro annotation de la siguiente forma:
      <g:plusone expr:href='data:post.canonicalUrl' size='medium' annotation='inline'/>

    • Guarda la plantilla y visualiza el blog. 

Tamaño del botón: 

Además del tamaño mediano (medium), si quieres puedes probar con otras dimensiones.  Sustituye la palabra medium resaltada en rojo por estas otras opciones:

  • Pequeño: small
  • Enorme: tall
  • Normal: déjalo en blanco, es decir size=''


Visita la página oficial del botón +1 de Google para ver otras opciones

Si te fijas además de este botón en iniciaBlog también tenemos el botón de "Me gusta" de Facebook y el botón de "Twittear" de Twitter que te recomiendo los implementes en tu blog (si no lo has hecho ya)

Si te gustan las publicaciones de iniciaBlog, puedes recibirlas directamente en tu buzón de correo electrónico o bien seguirme desde Twitter.com/iniciaBlog o Facebook.com/iniciaBlog

Lecturas recomendadas:

Gracias ;-)
Actualizado el 9 de Junio de 2013

127 comentarios:

  1. Excelente articulo, estaba poniendo todo el código del botón +1 en el mismo lugar y cuando marcaba el +1 se ponia en todas las entradas, e separado la parte del head y la otra y ya me funciona perfecto.

    Tienes un exelente blog, sigue asi ;)

    ResponderEliminar
  2. Efectivamente Juan Carlos,
    El tema es que por defecto el código del botón que obtienes desde Google está pensado como para Web no para el blog. La segunda parte del código está modificado para blogger para que esa capaz de tener en cuenta la url de cada post.

    Gracias por tu comentario.
    Un abrazo! ;D

    ResponderEliminar
  3. Hola
    tengo una duda, como google pide una cuenta, y en blogger uno puede tener múltiples blog, el botón +1 va hacia el dueño de esos blog, o a cada blog en particular? no sé si me explico.

    saludos

    ResponderEliminar
  4. Hola Javier,

    El voto que realiza un internauta, lo hace a cada entrada del blog. El internauta solo puede votar una vez a cada entrada. Nada tiene que ver el "dueño de esos blogs" el voto es para cada entrada.

    En un futuro (en el buscador en ingles ya lo puedes ver)...si alguien haciendo una búsqueda en Google da como resultado alguna de tus entradas, lo votos también saldrán como parte de la búsqueda.

    Gracias por tu comentario, no se si he sabido responderte.

    Un abrazo! ;D

    ResponderEliminar
  5. Hola,
    Mira, después de varios intentos, no logro que aparezca el dichoso boton +1 en mi blog:

    mundorespuestas.co.cc

    Ya tengo habilitada la barra social, el script en la plantilla, pero nada. Ayudame por favor.

    De antemano gracias. Saludos.

    ResponderEliminar
  6. Hola BlogMaster,

    El problema es que es posible que tu plantilla no esté actualizada. Pero indícame un correo al cual pueda responderte o usa el formulario de contacto...en mejor tratarlo por eMail ya que la respuesta es larga.

    Quedo a la espera. Gracias

    ResponderEliminar
  7. Era todo un misterio lo que significaba este simbolito. Todo clarito. Lo comparto en facebook.

    Saludos!!

    ResponderEliminar
  8. Muchas gracias por el post. Ha sido un tutorial muy claro y realmente efectivo. Mi blog ya tiene sus botones +1. Y por cierto, tu tienes mi +1 tambien. :-)

    Gracias

    ResponderEliminar
  9. Por cierto, una duda. Al poner los botones quedan muy pegados a la última línea de la entrada. ¿Cómo y donde puedo añadir un salto de línea antes de los botones para que deje más espacio? Muchas gracias.

    ResponderEliminar
  10. Simplemente añade una etiqueda "div> div/>"justo antes. creo que co eso puede funcionar

    ResponderEliminar
  11. Muchas gracias , no sabia como añadirlo y ya esta , pero un problema , me sale arriba de los botones de fb y twitter , como podria ponerlo a la misma altura??
    Gracias.

    ResponderEliminar
  12. Hola Risas Mil,

    Me he dado una vuelta por tu blog y ya los veo todos a la misma altura (lo he visto con el Chrome)...pienso que lo has resuelto ...si no es así vuelve a comentar. Gracias por participar con tu comentario.
    Enhorabuena por tu blog http://www.risasmil.com/

    ResponderEliminar
  13. impresionante mola mucho me a salido a la primera felicidades...ahora tengo otra duda como poner botones que al darle me salga en facebook o google+ ya que antes de instalar una plantilla predeterminada si que me salian ..gracias y sigue asi makina ...te dejo el enlace del blog http://aritztorres.blogspot.com/

    ResponderEliminar
  14. Muchas gracias!! ¡Me ha funcionado perfectamente!

    ResponderEliminar
  15. Gracias a ti Ger Carreras por comentar y visitar iniciaBlog. Un abrazo y seguimos en contacto.

    ResponderEliminar
  16. gracias, ya está puesto y a la primera!

    ResponderEliminar
  17. Gracias Aeren!!!

    Espero seguir en contacto. un abrazo.

    ResponderEliminar
  18. Muchísimas gracias, creo que funciona, Bien!!!

    ResponderEliminar
  19. Muchas gracias por la explicacion
    muy detallada,
    como se puede hacer para que aparezca al final si no al inicio de la pagina
    gracias

    ResponderEliminar
  20. Gracias Alrodex,

    Para ponerlo al comienzo prueba a buscar class='post-header-line-1'/> en el código de la plantilla. Recuerda siempre hacer una copia de seguiridad. El codigo deber ir justo debajo. Es cuestión de probarlo y ver que tal queda...coméntame. Comparte un enlace para ver tu blog.

    Mucha suerte y un abrazo!! ...y gracias por participar en iniciaBlog con tu comentario.

    Saludos, Jesús Glez.

    ResponderEliminar
  21. Gracias Pilar!!! He visto tu blog y el botón +1 felicidades!
    Te he dejado un comentario en tu blog. Un abrazo y mucha suerte ;-)

    ResponderEliminar
  22. Saludos, mira, ya he probado tu codigo pero no me muestra el botón +1, tengo una plantilla personalizada no de las que ofrece blogger; que puedo hacer para que me aparezca, gracias

    ResponderEliminar
  23. Hola Luis Antonio,

    Debe seguir el segundo método y debe funcionarte. Otra cosa es que no encuentres algunas de las secciones pero aunque tengas una plantilla personalizada debes tener un pie de entrada donde colocar el código.

    Coméntame ya que es interesante para todos. Gracias por participar con tu comentario.
    Saludos, Jesús.

    ResponderEliminar
  24. Muchas Gracias, me sirvio muy bien

    ResponderEliminar
  25. hola, gracias por responder, ya logré que se muestre el botón +1, pero me lo coloca en la parte de arriba, te paso el link de mi blog: http://blog-luisponce.blogspot.com/

    ResponderEliminar
  26. Gracias xvmaster!!!, bienvenido a iniciaBlog espero que sigamos en contacto. un saludo

    ResponderEliminar
  27. Bien Luis vamos avanzando...El sitio realmente es correcto...no sé donde te gustaría que estuviera. Si quieres ponerlo por ejemplo debajo del título busca post-header-line

    Si lo quieres en la misma zona a la izquierda pero mas abajo es cuestión de que tu mismo desplaces el fragmento de código más abajo. creo que tienes un post-footer-line-2 e incluso un post-footer-line-3 es cuestión de probar...pero ya lo tienes.

    coméntanos para ver que tal te ha quedado. Gracias y seguimos en contacto.

    ResponderEliminar
  28. Hola. Yo tengo un problema con mi blog, es fuerteabajo.blogspot.com y no me aparecen los botones debajo de la entrada. Cuando voy a diseño-entrada y modifico los lugares la configuración se guarda en blogger pero no se aplican.
    Es decir, cada vez que me fijo las modificaciones supuestamente se guardaron,pero en la página no se modifica nada!!
    Por ejemplo, si cambio de lugar las etiquetas para que se muestren arriba de la entrada, se guarda la configuración peroal entrr a la página siguen abajo.
    Y esto mismo sucede con los botones de twitter, facebook, etc... no aparecen!!!
    Gracias,y espero que puedas ayudarme

    ResponderEliminar
  29. hola tengo un extraño problema, en las entradas
    yo tengo habilatado los botones de compartir con las redes sociales y se ve ya el boton+1 pero no se veian el blog en una pagina de ayuda bloger encontre el codigo para que se vieran lo puese y se ven los botones de compartir,pero no se veia el boton+1 encontre tu pagina y he puesto la opcion 2 y ahora tengo dos botones+1 al ponerla tu boton sale ahoraen los botones de compartir si quito tu boton+1 se quita tambien de los botones de compartir este es el elnlace a mi blog y no lo entiendo xk pasa

    http://zerezas-curiosidadesvarias.blogspot.com/
    gracias

    ResponderEliminar
  30. Hola Zerezas,

    La pregunta es qué hacemos, mi recomendación de no usar la barra que trae por defecto blogger, ya que los iconos de Twitter y Facebook no son muy intuitivos. Trata ahora de poner también el botón de Twitter siguiendo este tutorial donde te dice como ocultar la barra estándar por código.
    http://www.iniciablog.com/2011/03/twitter-blogger-cada-entrada-post.html (al final te debe quedar como lo tengo yo en iniciablog)...Coméntanos vale?

    Gracias y un abrazo

    ResponderEliminar
  31. a ver para poner ese boton me tengo que registrar en twiter es asi? yo no quiero teber una cuenta en twiter
    el problema es que los botnes no funcionan el que puse de bloguer no funciona si quito la opcion en la entarada
    bien
    si quito tu boton se visualiza el compartir las redes sociales pero se quita de ahi el boton+1 es posible que no me explique bien
    si es asi lo siento y si me da problemas como veo lo quito y punto
    gracias jesus

    ResponderEliminar
  32. hola jesus ya encontre la solucion aqui
    http://ciudadblogger.com/2011/06/anadir-el-boton-1-de-google-en-blogger.html
    ya solo tengo un boton+1 en los botones de las redes sociales
    http://zerezas-curiosidadesvarias.blogspot.com/
    puse este codigo
    despues de head
    script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
    esto era lo que me pasaba

    gracias por todo
    ZereZas.

    ResponderEliminar
  33. gracias por tu felicitacion me alegra que te haya gustado me cuesta mucho porque estoy aprendiendo
    sobre la marcha imagino que como todos y cuando no tengo un problema me busco yo otro y los soluciono como puedo me borrado el feed de ese blog fortuitamente y ademas no me dedireccionaba
    a otros blogs las entradas que pulico desde hace un mes y ahora no me deja poner el feed
    en fien es una detras de otra jeje
    pero bueno ahi vamos
    gracias por todo
    ZereZas.

    ResponderEliminar
  34. Hola Zerezas,

    No es necesario que te registres en Twitter, el botón de Twitter bajo cada entrada ofrece a tus lectores la posibilidad de enviar a su respectivo Twitter (el del lector) un enlace hasta tu post....

    ResponderEliminar
  35. Zerezas,
    Perfecto que hayas encontrado solución...entre todos vamos dando pasos hacia adelante.

    ResponderEliminar
  36. ok si no hay que hacer una cuenta en twuiter lo intentare si tengo problemas aqui estare me gusto tu blog porque es legible y se entiende muy bien como donde encontre la solucion explicais bien que yo pueda enterlo muchas gracias no todos los blogs de ayuda son tan claros ha sido dificil para mi entrar en la plantilla y modificar cosas, vosotros lo ponesis muy facil para qu lo pueda hacer con perdon me sonaba a chino bueno ahi voy ya te contare chao
    zerezas.

    ResponderEliminar
  37. Hola!!! Quisiera saber como hacer para ver quien presiona el boton google + 1 en mi blogger...Gracias

    ResponderEliminar
  38. Hola Scaramanzia,

    Es una buena pregunta. Tanto como el quién no sé si lo podremos saber pero si que existen estadísticas de la cantidad de clics, el impacto sobre tu página, etc. En lecturas recomendadas de este mismo post te he puesto dos enlaces muy útiles.

    Las herramientas para webmaster de Google te ofrecen estadisticas directas sin que tengas que hacer nada. En el caso de Google analytics habría que hacer cambios en el HTML...

    Coméntanos.

    Gracias y mucha suerte.

    ResponderEliminar
  39. Gracias che, perfecto eso de webmaster. Ahora te hago otra pregunta acabo de poner la insignia de mi perfil de facebook en mi blog pero me queda del izquierdo y quiero que me quede en el centro pero intente y no logro que me quede y tampoco me sale la actualizacion de mi estado porque me sale como que es ninguno y yo en facebook tengo uno. Tenes idea como puedo hacer? Te paso mi blog para que veas lo que intento preguntarte
    http://expresionnoctambula.blogspot.com/
    Gracias de nuevo por ayudar, es muy bueno lo que haces!!!!Ojala sepas responderme.Saludos

    ResponderEliminar
  40. Hola Scaramanzia,
    ¿vistes el tema de las estadísticas del botón +1?
    Con respecto a como centrar tu estado debo enviarte un fragmento de código por lo que tendría que decirme a que email te lo mando. Si quieres utiliza el formulario de contacto de iniciablog y te respondo al email que me indiques.

    Un abrazo y gracias por tus preguntas.

    ResponderEliminar
  41. Aviso de actualización:

    Esta entrada ha sido actualizada para ofrecer una mejor comprensión en la parte que afecta a la edición de la plantilla para situar el botón de Google+. Además queda vinculado este tutorial también con los tutoriales para el botón de Me gusta de Facebook y Twitter tal y como aparecen en iniciaBlog.

    Espero que la actualización de esta entrada sea de tu agrado. Gracias

    ResponderEliminar
  42. Agradezco mucho, me sirvió un montón esta entrada. ¡Un saludo! =)

    ResponderEliminar
  43. Gracias Addax me alegra saber que te ha servido de eso se trata. Seguimos en contacto....

    Mucha suerte, Jesús!

    ResponderEliminar
  44. Muchas gracias por compartir tus conocimientos con nosotros, me han servido bastante.. Saludos desde México...

    ResponderEliminar
  45. Gracias Jahir Angel...de eso se trata y además todos aprendemos...un abrazo y mucha suerte desde España!

    ResponderEliminar
  46. Hola, tengo un problema, yo tenia el boton +1 colocado de antes, con el codigo que te proporciona google para la pagina, lo borre para colocar este codigo, ya que vi que era para las entradas individuales y no para todas, pero al colocarlo me aparecen dos botones +1, uno tiene pinta de ser el viejo, porque tiene puesto +2 entodas las entradas y el otro parace ser el bueno, me he asegurado que el codigo del antiguo esta borrado, pero aún asi no consigo hacer que solo aparezca un boton

    ResponderEliminar
  47. Hola Droiden...
    efectivamente he visto tu blog, busca en la pantilla esta linea post-header-line-1 y creo que el botón es justo la linea que tienes encima, es cuestion simplemente de quitarla. Si quieres haz copia de seguridad primero.

    ya me comentas y gracias por dejar tu comentario

    ResponderEliminar
  48. Muchas gracias por contestar tan rapido, efectivamente era la linea esa, ya esta borrada y ahora si sale perfecto, muchas gracias y enhorabuena por este excelente blog

    ResponderEliminar
  49. Buen post, cambie de plantilla y creía que era un fallo de google pero no, esque tenia que añadir el código antes de /head.

    ResponderEliminar
  50. Gracias OpeningsAnimes, efectivamente es importante el código al inicio en el Head a mi me pasó algo parecido con blog.

    Gracias y un fuerte abrazo!!

    ResponderEliminar
  51. SALUDO YO INSTALE EL ME GUSTA EL TWITTIAR Y EL GOOOGLE+ PERO EL GOOGLE MAS SOLO APARECE EN UNA SOLA ENTRADA EN EL PRIMERO DEL INICIO , LAS DEMAS ENTRADA NO APARECE , Y OTRA COSA COMO PUEDO HACER QUE ESTE EN ORDEN HORIZONTAL PORQUE EN LO QUE VEO ESTA EL ME GUSTA POR ENCIMA DE TWITTEAR ,
    ESTE ES MI PAGINA http://memeadictos.blogspot.com

    ResponderEliminar
  52. Muchas gracias!!!! Va de lujo!!!

    ResponderEliminar
  53. Hola Enrique,

    Por lo que he podido ver en tu blog, has puesto los dos fragmento de código en el mismo sitio y no es correcto. El que tienes mal es el que figura como punto 1 del segundo de los métodos. Este fragmento de código deber ir en el HEAD> del blog.

    Para poner los tres botones en la misma fila debes poner el código de los tres dentro de una etiqueta DIV

    ResponderEliminar
  54. awwww yeaaaaaaaaa funciono :D Ahora me falta tenerlo en fila horizontal

    ResponderEliminar
  55. Hola, he intentado poner el botón +1 en mi página de Wix pero no aparece, simplemente copio el código que se genera en (http://www.google.com/webmasters/+1/button/)y no sale el botón, no se si tenga que pasar algún tiempo para que se pueda visualizar, por lo mientras no sé cuál podría ser el motivo de no aparecer?

    ResponderEliminar
  56. Enrique,

    mi recomendación es que apliques este tutorial tal cual se describe. Recuerda que una parte del código va en el head y la otra en el lugar donde quieres que aparezca el botón. Por ultimo recordarte que este código esta adaptado para blogger.

    Un abrazo y coméntame....gracias

    ResponderEliminar
  57. Hola, la verdad que tu blog me ha sido de mucha ayuda. Solo tengo un inconveniente, cuando coloco el código, el botón +1 (Google) aparece debajo de mis otros botones. http://rociolione.blogspot.com ese es mi blog. Un saludo.
    Excelente blog!, felicitaciones.

    ResponderEliminar
  58. Tomo nota y voy a probarlo. Gracias.

    ResponderEliminar
  59. Hola, en primer lugar te doy las gracias de antemano por tu ayuda. Verás, acabo de encontrar tu web- por cierto, muy clara e ilustrativa para las novatas como yo-; he puesto en primer lugar el botón de facebook según tus pasos y ha salido bien, después el de twitter y sin ningún problema. El fallo ha venido al incluir tb arriba el google +1 y por alguna extraña razón me desaparecía el del facebook. He contrastado con otros navegadores como mozilla, safari, chrome y se veían los 3 botones, pero con explorer no. Así que no me ha quedado más remedio que quitar el botón de google +1.

    Por otra parte, antes de encontrar tu web puse un botón más feo de tweetmeme que me costó mucho incluir, creo que ahí estropeé la plantilla, porque la frase tras la que tenía que poner el botón me sale duplicada (me salieron dos botones y no sé cómo quité el que me sobraba). El caso es que no consigo quitar ese botón obsoleto que además me desconfigura el blog ¿podrías ayudarme? Me voy a volver loca...

    El enlace es este: http://bienvenidosaldesvandepauline.blogspot.com/

    Saludos

    ResponderEliminar
  60. hola Jesús
    muchas gracias por compartir sus conocimientos,
    te comento que a pesar de que tengo el botón 1+ en la edición de entradas, no me aparecía.
    había puesto en mi blog los datos que te dan en la pagina en la que seleccionas el tamaño del botón +1 y me apareció pero desapareció posteriormente.
    ahora tengo las dos opciones aplicadas. y ademas me di +1 yo misma para ver si utilizándolo se queda ya en mi blog
    cree usted que me afecte tener las dos opciones?
    gracias de antemano por su atencion a esta novata

    ResponderEliminar
  61. Jolin, con lo bien que explicas todo... yo no soy capaz de poner el dichoso botón..
    este es mi blog: www.aromaenelpaladar.com

    Muchas gracias de antemano y un saludo!!

    ResponderEliminar
  62. Gracias por tu esfuerzo.Se le puede poner alguna frase tipo AYDUDANOS A DIFUNDIR para que aparezca al lado del +!

    ResponderEliminar
  63. hola amigo todo me quedo genial... pero aqui esta mi blog http://clickspc.blogspot.com/ puedes notar que el Google+1 esta separado de los demas y no se porque quedo asi... sime puedes ayudargracias

    ResponderEliminar
  64. no me aparecen los botones, ya marque la casilla de compartir botones pero no aparece nada :(

    ResponderEliminar
  65. hola, tengo implantado el boton de google+ pero quiero hacerte una consulta si es posible, me gustaria cambiar la imagen que se muestra al pulsar mi boton (el de las entradas y el de compartir el blog)la imagen que me sale es la de la cabecera de mi blog y quisiera modificarla, creo que se puede hacer personalizando el fragmento que trae el boton pero no se como hacerlo, en otros blogger he visto que se muestra la imagen distinta a la cabecera y eso es lo que yo quiero ¿me puedes ayudar)

    ResponderEliminar
  66. A mi me ha desaparecido el dichoso botón en mis dos blogs desde que vinculé las cuentas a google+ :(

    ResponderEliminar
  67. Muchas gracias por éstas publicaciones, a las patosas como yo nos vienen genial.

    Solo tengo una duda... Con el Google+. Introduzco el código pero no aparece. Con el de Facebook no he tenido ningún problema... El código que pongo es el que se indica (), pero, ¡no funciona! :-(

    Creo que voy a necesitar un cursillo para patosos nivel -1. ;-)

    ¡Muchas gracias!

    ResponderEliminar
  68. Hola! Excelente Blog. Funcioionan a la perfección los botones para facebook y twitter, pero no logro poner el de Google+.

    Muchas gracias por tu ayuda y tiempo!

    http://mercaditomodelo.blogspot.com/

    ResponderEliminar
    Respuestas
    1. Hola Anita,
      Tal y como me has pedido estoy tratado de averiguar que es lo que pasa con el botón Google+ pero lo cierto es que no veo el código por ningún lado....seguramente lo quitastes al ver que no funcionaba pero necesitaría chequearlo.

      Avísame cuando tengas el código segundo intento ¿te parece?

      Saludos y enhorabuena por tu blog.

      Eliminar
  69. Hecho :) Pero sigue sin aparecerme el botón.

    ResponderEliminar
    Respuestas
    1. Anita, te falta el fragmento de código del HEAD, el del paso 1

      Eliminar
  70. Un millóooooon de gracias! De verdad!!
    Fuiste muy claro desde un principio, pero nunca me dic uenta de que tenía que hacerlo en 2 pasos.

    Mil gracias otra vez por el tiempo y la atención! Un grande!

    ResponderEliminar
    Respuestas
    1. Perfecto..ahora si me voy a acostar tranquilo. Un fuerte abrazo.
      Saludos, Jesús.

      Eliminar
  71. Jesús, se agradece mucho tu clarísima explicación en cada tema.

    por alguna causa no me sale el botón de google+, es que mi plantilla en uno de mis blogs es de las antiguas y no sé cómo pasarlo a una nueva; de todos modos, muchas gracias, sólo te escribo para felicitarte por tu interesante y generoso blog!!!

    un beso.

    ResponderEliminar
    Respuestas
    1. Gracias Patricia por este estupendo comentario. Por mi parte solo decirte que fíjate que debes copiar dos fragmentos de códigos hasta tu blog, el primero deber ir en el HEAD, el segundo debe ir donde quieras que aparezca el botón.

      Seguimos en contacto
      Jesús González

      Eliminar
  72. hola, Jesús, muchas gracias a ti por tu atención.

    no he probado lo de la inserción porque cuando fui a configuración ya me aparecía la opción de compartir, tildé ahí pero no salió. la opción de copiar e insertar la dejé 'en espera' porque me parece un pelín complicada, la verdad es que no soy muy práctica en estos temas, jejeje...
    en algún momento me pondré a ver si lo logro, pero te repito, tú lo has explicado súper bien, soy yo que no me animo a meterme entre tanto código y cosas "raras", jijiji.

    un abrazo y gracias otra vez!!!

    ResponderEliminar
  73. Yo la verdad es que estoy intentando incorporar el botón+1 en el blog pero que sea integrado en mi web. lo que me pasa es que si hago un nuevo post el botón se queda como una imagen.
    Me gustaria por favor a ver como lo puedo hacer o cual seria el código correcto para insertar en el blog pero asociado a la web.
    gracias!

    ResponderEliminar
    Respuestas
    1. Hola ECOnsciene, efectivamente el codigo que encuentras en este post está adaptado a Blogger. Para obtener el código para tu página Web debes visitar este enlace http://www.google.com/webmasters/+1/button/ Desde ahí podras obtener el código necesario para tu página web.

      Si tuvieras alguna dificultad, vuelve a comentar e indica la url hasta tu web.

      Muchas gracias por tu comentario,
      Jesús González.

      Eliminar
  74. Hola Jesus:

    Cuando arreglamos el problema de los comentarios (no aparecía el responder) desaparecieron los botones de compartir. He intentado poner los predeterminados de blogger y no aparecen y tampoco salen si intento colocarlos al pie de los artículos. En cambio, al ponerlos en la cabecera sí que aparecen. No se porque, pero vamos que he pensado dejarlo así.

    Lo que ocurre es que está demasiado pegado al título del post. ¿Me ayudas a separarlo un poquito? ¿Cómo lo hago?

    Muchas gracias. :)

    ResponderEliminar
    Respuestas
    1. Te he enviado un mensaje directo a través de Twitter para ver por donde retomamos este tema.

      Eliminar
  75. me fuiste de mucha ayuda gracias

    ResponderEliminar
  76. Hola :) te quiero hacer una pregunta??? como hago para que el "comentarios y el publicado por quede en medio de mi blog?? es que no se por que queda raro :(, pero me sirvio mucho para poner los iconos del twiter y el fb y G+ aunk no me quedaron el la misma linea :P, ojala me puedas responde por fa :)

    muchas gracias.-

    ResponderEliminar
    Respuestas
    1. Hola,

      Con respecto a los iconos en la misma fila, he ido ha tu blog a verlo pero no los veo, sería muy importante con el fin de ayudarte poder verlos!

      Si no te cae en la misma fila normalmente es que no tienes espacios suficiente o bien tiene un salto de linea en el código, mira si encuentra algo como br/> y quítalo.

      Con respecto al tema de los comentario no entiendo muy bien la situación que me describes, si me pudieras poner un ejemplo en tu mismo blog...estaría genial!

      Gracias por pasarte por aquí, por dejar tu comentario....y nada solo darte la bienvenida a este blog.
      Mucha suerte
      Jesús González

      Eliminar
  77. jejeje ya lo pude poner al fin ese estupido boton de google para cada articulo (solo me contaba los clics del home), gracias por la informacion

    ResponderEliminar
    Respuestas
    1. Gracias InglésGratis me alegro mucho que te sirviera, gracias por comentarlo.
      Jesús González

      Eliminar
  78. QUIERO REALIZAR UN CAMBIO QUITAR UN GADGET QUE QUEDO POCO SERIO EN MI BLOG Y CON ESTA NUEVA CONFIGURACION NO ENCUENTRO LA FORMA DE QUE APAREZCAN LOS BOTONES PARA PODER REALIZAR LOS CAMBIOS COMO LO HACIA ANTES AGRADEZCO QUE ME AYUDEN
    GRACIAS

    ResponderEliminar
    Respuestas
    1. Hola Paola,
      Por lo que entiendo usabas la interfaz vieja y ahora con la nueva interfaz no encuentras algunas cosas ¿verdad?

      Mira este otro post: http://www.iniciablog.com/2012/04/nueva-interfaz-de-blogger-por-defecto.html

      Creo que es lo que estas buscando

      Un fuerte abrazo!
      Jesús González

      Eliminar
  79. Muy bien explicado! ¡Gracias!

    ResponderEliminar
    Respuestas
    1. Gracias Ainara, me alegro que te sirviera, lo he podido ver en tu blog...menudas fotografias!!!!
      Más que recomendado para todos los seguidores de iniciaBlog a los cuales les guste la fotografía:

      http://www.elmundoatravesdeunvisor.com/

      Seguimos en contacto.

      Eliminar
  80. Hola Jesús, siento darte la lata en domingo, contestame cuando puedas. Es que me pasa una cosa muy rara. He puesto el botón de Google+1 en cada entrada según lo que indicas. En la vista previa se me cargan correctamente las recomendaciones que tenía en cada entrada pero viendo el blog normalmente no, salen todas a cero. Espero que me puedas ayudar,

    Muchas gracias

    ResponderEliminar
    Respuestas
    1. Hola Elena,
      Gracias por tu comentario, además es una pregunta muy buena. Efectivamente existe un botón que muestra un contador con la cantidad de clics que ha recibido la entrada (anotación cuadro o bubble).

      Yo no lo tenía contemplado en este post, así que permíteme que haga pruebas con el. El que yo tengo es el que pone anotación inline.

      Una vez que pruebe te comento algo pero recuerda que estos botones normalmente llevan dos fragmentos de código que no sé si lo has tenido en cuenta. Uno va en la cabecera y en otro en cada post.

      Otro tema que es muy importante saber es que para saber quien ha hecho clic debes estar identificada con tu cuenta de Google y verás las caras de aquellos contactos que tengas en Google+, en Contacto o en Google reader y Buzz...es decir veras solo las caras de aquellos que ya formen parte de tus contactos.

      Estoy mirando esta página para conocer un poco más: http://support.google.com/webmasters/bin/answer.py?hl=es&answer=1140194

      Te digo algo más en cuanto lo pruebe.

      Gracias por avisarme
      Jesús González

      Eliminar
    2. Sí he puesto los dos fragmentos de código. Lo más raro es lo que te comento, que en la vista previa sí vea las recomendaciones, por lo que parece que se ha hecho correctamente, pero en la vista normal no. Si crees que con otro botón de google+1 puede funcionar, lo hago con otro.
      Gracias de nuevo

      Eliminar
    3. Hola Elena.

      Ayer mientras comprobaba el blog te di un +1 en una de tus entradas. Hoy me he vuelto a conectar para ver si conserva ese voto de dos maneras, iniciando la sesión y sin iniciar la sesión con mi cuenta de Google.

      El caso es que en la entrada Pasarela Cibeles: Novias de Pol Núñez veo en total 2 votos en cualquiera de las dos situaciones. Pero además cuando te visito con la sesión abierta esta misma entrada como te dije me muestra 2 votos pero además me pone el botón en rojo como diciéndome que uno de estos votos lo he dado yo. Si pulso nuevamente el botón me resta el voto dado ayer.

      Cuando en tu primer comentario me decías vista previa a que te referías a la vista previa cuando estas editando un post o con el inicio de sesión de tu cuenta de google?. Te lo digo porque si te referías a Vista previa del post a mi también me ha pasado incluso con otros notones pero no hay que hacerle caso a esos valores ya que son ficticios.

      En definitiva parece que va todo bien con este botón y que el código que has insertado en tu blog es el correcto.....

      Acabo de cambiar el botón que se muestra en esta misma entrada al que tu has puesto en tu blog para que veas los contadores y te sirva de referencia. Solo he tenido que cambiar el parámetro annotation='inline' por annotation='bubble'

      Un fuerte abrazo y no me quedo tranquilo hasta que me confirmes este comentario.

      Jesús González

      Eliminar
  81. No lo sé, a lo mejor es cuestión de que no se puede tener todo. Antes de poner el nuevo botón tenía los que vienen por defecto en blogger y algunas personas me hicieron +1 en las entradas (estos son los datos que no aparecen en el blog pero que sí veo en la vista previa de cuando modificas el código HTML y también en el listado de entradas). Los +1 que se hicieron a continuación de poner el nuevo botón son los que tu ves pero que entiendo que blogger no los "entiende" porque no los registra (no aparecen en la pestaña de las entradas dentro de blogger). No sé si me explico o te voy a volver loco...

    Aprovecho a hacerte una pregunta: ¿tu eres partidario de cambiar el perfil de blogger al personal de google+ cuando tu blog lo que persigue en definitiva es un fin comercial?

    Muchisimas gracias y perdona todas las molestias, en serio.

    Elena

    ResponderEliminar
    Respuestas
    1. Hola Elena,

      Solo por curiosidad, podrías darme algún dato cuantitativo por ejemplo de algunas de tus entradas, de manera que pueda hacerme una idea de cuantos votos tenias antes y cuantos tienes ahora.

      Con respecto al perfil de Blogger yo creo que es una evolución que hace Google para unificar los diferentes perfiles asociados a diferentes servicios. Recuerda además que ya puedes crear en Google+ páginas de empresa. Yo si sería partidario.

      No es para nada ninguna molestia, por favor comenta o pregunta lo que creas conveniente.

      Un abrazo!
      Jesús González

      Eliminar
    2. Muy poquillos votos pero me daba pena porque se lo había pedido a las amigas. Además, me preocupa que los nuevos votos blogger no los registre (en la pestaña entradas) porque nos sé si los tendrá en cuenta entonces. Por ejemplo tenía 2 votos en cada una de las 3 primeras entradas que escribí. Si me dices que no es preocupante pues así sigo y ya está, no hay problema.

      Gracias de nuevo,
      Elena

      Eliminar
    3. Hola Elena,
      Bueno lo que te ha pasado es algo de lo que hablamos en su dia y tiene que ver con el redireccionamiento de los dominios gratuitos de Blogger según el pais del lector. Para entender un poco más, mira ese post.

      Yo creo que como estas empezando no tiene ningún impacto y puedes estar totalmente tranquila.

      El código del botón que tengo en este mismo post está preparado para seguir obteniendo los valores correctos mediante el parámetro data:post.canonicalUrl

      Un abrazo,
      Jesús González

      Eliminar
    4. Otra cosa Elena,
      Como tu blog se basa mucho en fotos creo que puede interesarte conocer Pinterest. Bueno....como vez te estoy dejando tareas. jeje.

      Buen finde!

      Eliminar
    5. Muchas gracias por todos tus consejos. Miraré lo de Pinterest, aunque sufro saturación de redes sociales!

      Seguiré leyéndote que me ha gustado mucho tu blog y tu atención.
      Elena

      Eliminar
    6. Ok. Elena, a tu disposición. Un fuerte abrazo!
      Jesús.

      Eliminar
  82. Hola Jesús González gracias por el tutorial aplicandolo al blog y siguiendote ahora en Google1

    ResponderEliminar
    Respuestas
    1. Mil gracias Wmaster!

      y mucha suerte en tu proyecto!
      Jesús González

      Eliminar
  83. No consigo que el botón de Twitter y Facebook se coloquen a la misma altura en la misma fila, acaban colocándose uno debajo del otro. Qué hago?

    ResponderEliminar
    Respuestas
    1. Hola Carlos,
      Efectivamente es un problema..
      El problema que tengo es que no puedo pasarte código como respuesta a comentarios...pero básicamente es abrir una division y luego cerrarla al final del botón de facebook, algo así como
      div>....codigo de botones y luego cerrar /div> (falta el < a comienzo de cada division)

      Eliminar
    2. Si no te sale, por favor cumplimenta el formulario de contacto y te lo paso por correo al email que me indiques.

      Gracias por tu comentario!
      Jesús González

      Eliminar
  84. Respuestas
    1. Gracias W@LTER por darte una vuelta por aquí y sobre todo por dejar tu comentario.

      Bienvenido!
      Jesús González

      Eliminar
  85. Hola, Jesús.
    He puesto los botones de fb y google plus pero no consigo que queden alineados. Me sale uno un poquito más arriba que el otro. He hecho pruebas y con el de pinterest me pasa igual (aunque ahora no está, lo he quitado).
    El código está tal que así:
    < g:plusone expr:href='data:post.url' size='medium'/> < script src='http://connect.facebook.net/es_ES/all.js#xfbml=1'/>< fb:like expr:href='data:post.canonicalUrl' font='arial' layout='button_count' send='true' show_faces='false'/>
    Le he añadido un espacio entre cada < y su continuación para que me acepte el código en el comentario.
    El blog al que me refiero es http://ex-libris-sol.blogspot.com/

    ResponderEliminar
    Respuestas
    1. Es cierto Sol lo que comentas.
      A mi me pasa igual, me pasaba igual....Por favor revisa el post sobre el botón de Pinear de Pinterest y en el veras una explicación de cómo alinearlos botones. Debes poner una division (div)...lo tienes explicado al final de este post

      Comentame nuevamente si te ha servido.

      Muchas gracias
      Jesús González

      Eliminar
  86. Jesus ..solo darte las Gracias!!!!me estas ayudando mucho!! Un saludo

    ResponderEliminar
    Respuestas
    1. Mil gracias Freddy Martinez por darte una vuelta por aquí y comentar...
      Seguimos conversando,

      Jesús González

      Eliminar
  87. Hola, que significa la parte roja del codigo del +1 e google que dice 'medium'

    ResponderEliminar
    Respuestas
    1. Hola Xiss Okumura,

      Llevas toda la razón, se trata de los diferentes tamaños de este botón. Lo que he hecho ha sido actualizarlos con todas las opciones que tendrías a tu disposición.

      Muchas gracias por comentarlo

      Jesís González

      Eliminar
  88. No me sale el botón!!! Hice todo lo que dijiste... :(
    Ayuda!!!

    ResponderEliminar
    Respuestas
    1. Qué cosa más rara :(
      He visto tu blog y si que veo el de compartir. debería salirte sin problemas. Puedes volver a intentarlo por favor.

      Eliminar
  89. Respuestas
    1. Muchisimas gracias Delineante por tu comentario.

      Eliminar
  90. Hola jesus gonzalez tengo que hacerte 2 preguntas ya que sos experto en el tema jejee... 1º) como puedo saber quien puso +1 en una entrada mia del blog? solo sale que alguien puso +1 pero no me sale quien es la persona :/
    y 2º) como puedo agregarle un reloj al blog? antes sabia hacerlo pero ahora blogspot cambió el formato y me confunde.
    bueno gracias, saludos :)

    ResponderEliminar
    Respuestas
    1. Hola,
      Con respecto a tu primera pregunta la verdad es que no sabría que responderte. Lo más es aplicar el tipo de anotación inline tal y como menciono a l final del post. Con esto podrás ver las fotos de los perfiles de quien ha hecho +1. He mirado por Google Analytics y por las Herramientas para WebMaster pero no he visto nada más.

      Con respecto al gadget del reloj date una vuelta por GadgetsBlogger

      Gracias por comentar!

      Eliminar
  91. Hola!
    Muchísimas gracias, la verdad que no sabia como poner los botones y los que lleva google por defecto no se mostraban ni activandolos .Estuve a punto de buscar otra plantilla solo por poder tener los botones y gracias a tu tutorial he podido ponerlos todos sin problemas y esto que no se ni papa de codigos.
    Te lo agradezco de todo corazón.
    Un abrazo y Feliz 2013.

    ResponderEliminar
    Respuestas
    1. Muchisimas gracias por este estupendo comentario. No sabes la alegría que me da saber que te ha servido.
      Saludos,
      Jesús

      Eliminar
  92. Muchas gracias por el aporte, me funciona sin problemas.

    http://comprasotaku.blogspot.com.es/

    ResponderEliminar

Te agradezco la participación en iniciaBlog a través tu comentario. Recuerda que te responderé con otro comentario justo debajo del tuyo. Gracias y mucha suerte! ;-)

¿Cómo poner el botón de...:?

Premio Bitácoras

Aviso Legal

Licencia Creative Commons
iniciaBlog - Te ayuda con Blogger a mejorar tu blog
iniciaBlog se encuentra bajo una Licencia Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0 Unported.
Basada en una obra en www.iniciablog.com.

Creado por Jesús Manuel González Fuentes

Política de Privacidad de iniciaBlog | Política de Cookies
2023 © Jesús Manuel González Fuentes es el autor de iniciaBlog.com
Tema creado por Way2themes y adaptado por inciciablog