Botones oficiales para “compartir” en Blogger
Francisco / Publicado hace 593 días / 59 ComentariosBlogger ha agregado un nuevo detalle a su plataforma, se trata de botones para compartir el contenido de un post en servicios sociales como: Facebook, Twitter, Blogger, Google Buzz y el mail de toda la vida.
¿Cómo agregarlos?
Primero hay que activarlos en:
Escritorio → Diseño → Blog Posts → Editar
Si con esto no se muestran en tu blog, seguramente tienes una plantilla modificada, así que hay que agregar el código manualmente. En el código de tu plantilla (Escritorio → Diseño → Edición de HTML → Expandir plantilla de artilugios ), busca algo como lo siguiente:
<div class='post-footer-line post-footer-line-3'>Nota: también puedes buscar por post-footer-line-2 o post-footer-line-1.
Justo después agrega el siguiente código:
<!-- Botones para compartir --><div class='post-share-buttons'><b:include data='post' name='shareButtons'/></div>Te cuidado de que las etiquetas se abran y cierren correctamente, de otro modo, obtendrás un error.
Personalización
A partir de las clases que Blogger pone por defecto, es posible dar estilos a estos iconos y así personalizar su ubicación, dimensiones o cualquier otra propiedad con CSS. Las clases que agrega Blogger son:
.post-share-buttons {} /* Contenedor de los botones */
.share-button {} /* Aplicada a todos los botones */
.sb-email {} /* Botón para compartir por email */
.sb-blog {} /* Botón para compartir en un blog de Blogger */
.sb-twitter {} /* Botón para compartir en un Twitter */
.sb-facebook {} /* Botón para compartir en un Facebook */
.sb-buzz {} /* Botón para compartir en un Google Buzz */
Conclusión
Fieles a su costumbre, Blogger llega años tarde con características que sus usuarios ya usaban sin su ayuda. Me parece que la opción es completa, pues ofrece los servicios más usados por los usuarios: Facebook, Twitter y el correo electrónico. Este último, quizá es el mayor aporte de esta función, pues agrega una nueva página con un formulario fácil de usar, que además hace uso de los contactos guardados en GMail.
Muchas gracias!!!
Aunque agregando la opcion no me funcionó, lo hice agregando el código y funcionó perfectamente. Es realmente muy útil. Gracias!!
Muchas gracias por la ayuda! ya lo implenté por q los anteriores que tenía estaban haciendo la carga lenta.
Pues muy buen post, aunque a mi no me quedan ni agreándolos con la opción de blogger ni modificando el código manualmente. A pesar de que quite el de addthis que ya tenía ni así lo pone ni en post-footer-line-1 ni en post-footer-line-2 ni en post-footer-line-3, es más ni en post-footer-line (sin número).
@LMGuillermo: Lo que pasa es que tienen que ser ambas cosas a la vez, activar en el panel y luego agregarlo en la plantilla. Solamente si abriste tu blog en el último mes, no será necesario agregar el código manualmente.
Maestro GRACIAS!
Facilisimo de comprender, vas a favoritos.
Aaaaah lastima no me funciono! active los botones y no me aparecierón! agregue el codigo y desaparecen mis post’s! hehehe a que creen que se deba esto? cualquier ayuda o comentario les estare perennemente agradecido! saludos…..
@Zikeritox: Seguramente no has cerrado una etiqueta bien, comprueba todo se abra y se cierre como corresponde.
me sirvio bastante
Gracias!!!
hola queria preguntarte si me ayudarias a centrar los botones gracias
Hola! Muchisimas gracias por el post!!! Antes activando los botones no me salían, pero al poner el código en mi plantilla si!!! Muchas gracias por la ayuda ^^
Un saludo
Gracias
no sabia como ponerlos
saludos!
Muchas Gracias!! funciona perfectamente el codigo.. lo unico que en vez de un 1 me aparecia un 3 en este, en el nº final->
GRACIAS!!! Me funcionó de 10 el codigo!!! Excelente!!! +10 para ustedes!!!
Hola, gracias por el post, tengo una consulta, ¿como puedo hacer que los botones se vean en color y no grises?, ¿en que parte del css o html le modifico?, saludos y gracias de antemano
HOLA COMO TE VA, QUIERO QUE ME AYUDES PORFIS DIME COMO PUEDO INCLUIR COMPARTELO EN TWITTER EN MI BLOG, YO NO SE MUCHO DE HTML, AYUDAME PARA PONER EL CODIGO EN I BLOG,
GRACIAS
HOLA GRACIAS POR TODOS TUS COMENTARIOS, PERO NO SE POR QUE SE PUSO NOMODIFICAR, ME LLAMO BEATRIZ, A TUS ORDENES Y ME ENCANTAN TODOS TUS ARTICULOS
SALUDOS
Hola, Francisco, apliqué tus indicaciones y conseguí ubicar el botón de “me gusta” de Facebook, en la página de cada entrada de mi blog. Muchas gracias.
Ahora quiero preguntarte: ¿Cómo puedo hacer para ubicar este botón al lado de los botones para compartir y que no quede desalineado y haya todo ese espacio después de él?
Excelente tu página, y te agradeceré que me respondas. Abrazo!
Muchas gracias por tu post me ha servido de gran ayuda.
Un saludo, Phoenix.
funciono gracias
de hecho ya estan los botones desde Twitter eso es una maravilla pues nos libramos de los plugins al menos en wordpress
¡Muchas gracias por esta entrada, me ha sido de gran ayuda para incorporar los botones oficiales de compartir!
Seguiré pasándome para leer los tutoriales, creo que me van a ser muy útiles así que de nuevo, ¡gracias!
Javi
que tal, me fue de mucha ayuda tu articulo, ya logré lo que quería después de batallar jajaja
solo tengo una duda… cuando le doy click al botón de compartir a facebook, sí funciona solo que en mi muro sale parte del código y no la reseña del artículo… copio aquí lo que aparece:
var mydate=new Date() var year=mydate.getYear() if (year < 1000) year+=1900 var day=mydate.getDay() var month=mydate.getMonth() var daym=mydate.getDate() if (daym
incluso he visto q en varios muros de gent que comparte en su face, aparecen codigos similares, que puedo hacer??
gracias!!
Hola Francisco, he agregado el código en la plantilla de HTML pero al momento de probar los botones aparece que no encuentran la página y un error…¿que puedo hacer?
Gracias por la info. me aparecen los iconos pero al comprobar me da error. Aparece que la página no existe. No encontre ni 1, 2 ni 3 y lo puse al final de footer’. Sabes donde puede fallar?
Gracias,
Nacho.
¡¡Muy bueno, muchas gracias!!
Recién lo agregué a mi blog. Le incluí un float right para que flote a la derecha, pero no sé por qué se ve excelente en Google Chrome e IE, pero aparece una línea en blanco en Firefox =S
¿Tenés idea de qué puede ser y cómo arreglarlo?
¡Saludos, y muchas gracias otra vez!
Amigo me podrias ayudar, ya busque el codigo que especificaste, pero no aparece en mi blog (en la edicion html).
Me podrias ayudar?
Muchas gracias. No sabia que código se tenía que añadir para que apareciera!!!
Muchísimas gracias!
Que tal Francisco ni idea que se podia hacer de esa manera, en mi plantilla no salia, Mil Gracias por el aporte…
@angelikova:
hola a mi igual me sale ese error en facebook en mis entradas individuales en blogspot estoy rompiendome la cabeza con esto pero lo encontrare pero esto me pasa pues tengo un script para miniaturas en mi portada y cuanda ingreso en cada entrada y se comparte aparece el error de una parte de mi script
summary_noimg = 300; summary_img = 300; img_thumb_height = 145; img_thumb_width = 185; //=1) { imgtag = ”; summ = summary_img; } var summary = imgtag + ” + removeHtmlTag(div.innerHTML,summ) + ‘
Hola!
He intentado varias veces pegar el código que indicas, pero me dice que no se puede guardar y aparece la siguiente frase:
Se ha encontrado más de un artilugio con el ID: HTML18. Los ID de artilugio deben ser exclusivos.
Que puedo hacer???
Gracias!!
Marce
Un artículo de gran ayuda. Gracias.
Hola. Active la opción e inserte el codigo pero no se ve. Buscando vi que ya está el codigo en mi plantilla, debajo de ’2′ pero no se ve… ¿Qué podrá estár pasando????
GRACIAS!
Muchísimas gracias por tu ayuda!
yo quiero modificarlo que al pasar el raton sobre ellos se expandan xD y no e podido
GRACIAS!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
LO NECESITABA MUCHO!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! ERES UN GENIO!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Hola,
Necesito poner un boton de Me Gusta en un correo generado por mailchimp, puedes ayudarme,
gracias
Recientemente he creado un blog y aunque aparecen los botones de compartir, el botón de Facebook no funciona correctamente. Cuando se abre el enlace no aparece la entrada publicada en el blog sino esto: “Blogger: Sign in”. ¿Podrían ayudarme? Mil gracias! Lía
Hola Francisco.
Un ciber abrazo y felicitaciones por tu super útil blog. De hecho hay mucho para aprender aqui. Hoy deseo hacerte la siguiente consulta. Hace algunos días cambie la plantilla de mi blog de blogger por uno más profesional y en esta aparecen los iconos de facebook y twitter, pero al hacer click no redirección a estas redes. Cómo puedo activarlos??
Desde ya mil gracias.
Lourdes.
HOLA FRANCISCO, SALUDOS MUY BUENA TU PAGINA.
Mira yo he buscado los elementos que tu dices en el post los ”
Nota: también puedes buscar por post-footer-line-2 o post-footer-line-1. ”
pero no me salen esos elementos donde los puedo colocar otra cosa, tengo activado los botones como tu dices que hay que hacer primero y no pasa nada, al igual que me he buscado en interner colocar un share facebook despues del post.body y tampoco no se que pueda hacer mira mi plantilla es modificada para blog es de wordpres modificada para blog esta es mi blog
agradeceria tu ayuda francisco que de todas formas no he podido hacer esto, y como tu sabes ahora se a transformado en un alemento indespensable para la sobrevivencia de una pagina compartirlo con las redes sociales
atte.
Luis Cristobal Saavedra
mismo problema que cristobal solamente que los botones figuran en mi template pero estan ocultos, es como si mi plantilla los tapara, cambie los colores de los mismos. el template lo baje premiumbloggertemplates y vi que a unos cuantos templates de esta pagina tienen el mismo problema. me gustaria postear el codigo fuente de mi blog para ver si se puede resolver. muchas gracias
Mismo Problema que Alex, auxilio!!!!!!!
Puse la plantilla Notebook 2.0 en mi blog, para empezar la plantilla venia incompleta y no se veian los botones de compartir sino solo texto con el vinculo, se que estaba incompleta la plantilla porque lo encontré en otra pagina de ayuda, y pude corregír ese error, pero a medias. Ahora veo los botones pero sigue apareciendome un pedazo del texto de antes sobre cada boton… no tengo idea de como editarlo, ademas que los botones se ven grises y no de colores como los he visto en otras paginas… Que debo hacer?
Muchas gracias por la explicación. Aprovecho para preguntar si suele notarse de forma clara algun aumento de visitas por el hecho de tener el botón. Un saludo!!
hola…. tengo un inconveniente con este tema. Al cambiar la plantilla minima por la de Google-Chrome los iconos se hicieron invisible dejando mucho espacio entre entradas. Digo invisibles porque al pasar el puntero del mouse este cambia de forma y muestra un texto aludiendo a dichos botones, incluso funcionan normalmente pero no se los ve. El codigo que expones figura en la plantilla asi como las propiedades de los mismos.
Desde ya muchas gracias y felicitaciones por la pagina, simple, clara y concisa
atte Luciano
Muchas gracias, ha sido de gran ayuda
Gracias, me fue de mucha ayuda, llevaba mas de un mes sin saber como hacer eso…
Como podemos hacer para enmarcar los botones, es decir para meterlos dentro de un rectangulo de color?. Gracias.
Hola Francisco, ojala puedas ayudarme.
He puesto un “like” y “share” de facebook al blog entero (de blogger) pues queria que la gente compartiese la página entera, lo he puesto como widget y he teido que meter info de meta tags para el open graph de facebook, para que reconociese bien la pagina y la imagen que debe mostrar.
Lo que pasó es que ahora los “like” y “share” de los post no detectan el post individual y hace referencia solo a la pagina entera… No encuentro como cambiar esto sin afectar a los meta tags…
La verdad es que no se mucho de esto y lo poco que he ido descubriendo me tiene un poco confundido…
¿Puedes ayudarme?
muchas gracias!
Llevo mucho tiempo leyendo tus ayudas y soluciones, también en otras páginas y no he conseguido por medio de ninguna de ellas que se me solucione el problema de los botones. Los tengo marcados para que aparezcan, incluso desde el gadget de entrada, los he movido de sitio para hacer comprobaciones. También he visto que el código aparece tras el post body 3, pero siguen sin verse, y tampoco he conseguido después de muchos intentos reducir el espacio tan grande que queda entre las entradas. Estoy ya desesperada y no sé cuál puede ser el problema. ¿Me puedes echar un cable? Muchas gracias.
Mil gracias por la ayuda, casi que lanzo la laptop por el balcón, hasta que encontré tu artículo. Genial!!!
era taaaan facil jajaja gracias!!
Hola, gracias x tu ayuda; pero no ni por la via de diseño y clickeando en los botones de Fbookk y otros ni modificando la plantilla (no me sla la linea de post-footer…) me salen los botones: no se como hacerlo ! Pablo
De todos los links que abrí, busqué, usted fue el que mejor lo explicó, fue el más didáctico y más efectivo, para alguien que no tiene mucha experiencia informática. Saludos.
Yo he conseguido hacerlo metiendo el codigo despues de
Despues de (quitar espacios para buscarlo)
Despues de: