comunidades

Cómo poner otros botones para compartir en el blog

Os habréis dado cuenta ya que los iconos para compartir que trae Blogger, son bastante pequeñitos y discretos: 



Por eso yo los cambié hace ya tiempo por otros que pasan un pelín menos desapercibidos:


Tampoco quiero ser "pesada" y poner unos gigantescos, pero esos me parece que se ven lo suficientemente bien como para "recordar" a la gente que pueden compartir mi post en las redes sociales:


Me habéis preguntado varias veces cómo los he puesto y por eso voy a explicarlo. Realmente no tiene mayor misterio, porque he usado una página/aplicación para ello.
Los vi por primera vez en el blog de Sincerely Jules (ya no tiene esos) y desde entonces tengo estos en mi blog:Cómo poner los botones para compartir más grandes en el blog:

1) Vamos a la página ShareThis - Sharing tools
2) Elegimos la plataforma que usamos (yo Blogger) y le damos a Next:


3) Elegimos el aspecto que queremos que tengan (yo tengo los del medio y Sincerely Jules tenía los de la derecha), y a Next otra vez:


4) Entonces elegimos qué iconos queremos exactamente. Yo pongo en este orden Facebook, Twitter, Pinterest, Google+ e Email. Si queréis más solamente tenéis que arrastrar los de la columna del medio (Sharing buttons) a la de la izquierda (Selected Services). Además podéis ordenarlos simplemente pinchando y arrastrando.
Yo simplemente dejo los iconos de compartir, porque pienso que es mejor así, pero también podéis añadir un Me gusta de Facebook, etc.


5) En el momento en que le deis entonces a Get the Code, podréis registraros o simplemente darle a No thanks, just give me the code.
Si os registráis luego podréis ver vuestras analíticas.
6) Entonces os saldrá una página con la previsualización de cómo quedarán vuestros iconos en el blog, y el código que necesitáis. Lo seleccionáis y copiáis:


7) Y en Blogger, vais a la zona de Diseño - Añadir un gadget - Gadget de HTML - lo pegáis, y le dais a Guardar.
Guardáis la disposición en el blog, y ya los tenéis.


8) Ahora ya solamente tenéis que eliminar los de Blogger.
Zona Diseño - Entradas del blog - Editar - Desmarcar el tic de los iconos - Guardar gadget. Guardar disposición.


Y ya están:


¿Veis qué fácil?
9) OJO
ShareThis trae por defecto algo que a mi me pone muy nerviosa, y que es que cuando alguien copia y pega un texto de vuestro post, le sale sin los espacios que habéis puesto, y con un molesto "- See more at: y la url de vuestro post"
Podéis, a vuestra elección, quitarlo o dejarlo (yo recomiendo quitarlo). Si no sabéis si lo queréis, simplemente tratad de copiar y pegar dos o tres párrafos de vuestro propio blog y fijaos en lo que hace. Entonces decidís.
¿Cómo arreglarlo? Nos lo cuentan en esta página de atención al cliente de SharThis.
Si usáis Blogger, os lo cuento yo ya.
En vuestro código debéis mirar con atención dónde acaban las cositas que habéis añadido. Es decir, yo en este ejemplo, como habéis visto, lo último que sale es el email.
Vamos por orden y vemos Facebook (lo pongo en rosita), twitter, pinterest, google plus, y el email (también lo pongo en rosita).
<span id="st_finder"></span><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger2.js"></script><script type="text/javascript">var switchTo5x= true;stBlogger2.init("http://w.sharethis.com/button/buttons.js",{"facebook":["hcount","Facebook",""],"twitter":["hcount","Tweet",""],"pinterest":["hcount","Pinterest",""],"googleplus":["hcount","Google  ",""],"email":["hcount","Email",""]});var f = document.getElementById("st_finder");var c = f.parentNode.parentNode.childNodes;for (i=0;i<c.length;i++) { try { c[i].style.display = "none"; } catch(err) {}}</script>
Y justo después del email y el corchete que lo cierra ] veis una llave:
}
Ok, pues después de esa llave, y antes del paréntesis siguiente, debéis añadir:, "INSERTYOURPUBKEY", {doNotHash:true,hashAddressBar:false,doNotCopy:true}

Para que os resulte más cómodo yo os recomiendo "cortar" vuestro código con unos intros:
<span id="st_finder"></span><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger2.js"></script><script type="text/javascript">var switchTo5x= true;stBlogger2.init("http://w.sharethis.com/button/buttons.js",{"facebook":["hcount","Facebook",""],"twitter":["hcount","Tweet",""],"pinterest":["hcount","Pinterest",""],"googleplus":["hcount","Google ",""],"email":["hcount","Email",""]});var f = document.getElementById("st_finder");var c = f.parentNode.parentNode.childNodes;for (i=0;i<c.length;i++) { try { c[i].style.display = "none"; } catch(err) {}}</script>

Entonces ahí en medio pegáis la línea de código que os decía. Así: 

<span id="st_finder"></span><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger2.js"></script><script type="text/javascript">var switchTo5x= true;stBlogger2.init("http://w.sharethis.com/button/buttons.js",{"facebook":["hcount","Facebook",""],"twitter":["hcount","Tweet",""],"pinterest":["hcount","Pinterest",""],"googleplus":["hcount","Google ",""],"email":["hcount","Email",""]}

, "INSERTYOURPUBKEY", {doNotHash:true,hashAddressBar:false,doNotCopy:true});var f = document.getElementById("st_finder");var c = f.parentNode.parentNode.childNodes;for (i=0;i<c.length;i++) { try { c[i].style.display = "none"; } catch(err) {}}</script>

Una vez de que lo tenéis así, que veis claramente que está todo bien (la llave, el código en medio, y el paréntesis después) entonces ya podéis quitar los espacios y dar a guardar los cambios en vuestro gadget de HTML.
Mil besos, y muchas gracias por vuestros comentarios.
No os olvidéis tampoco que tenéis los botoncitos para compartirlo y también para dar al +1 justo debajo de mi firma :)

¡Gracias por suscribirte! Mil besos, Blanca

Fuente: este post proviene de Personalización de Blogs, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

Recomendamos

Relacionado

Tutoriales Redes Sociales Web

Como Personalizar botones de compartir.

Que feliz que me hace regresar al blog. Como algunos de ustedes saben, me fui de vacaciones, y regreso supercontenta, Mexico tiene lugares hermosos, llenos de historia y cultura, pero bueno esa es otra historia. Hoy vengo con un tutorial, que ya buena falta hacia por aquí en el blog. Este va a petición de mi amiga Marysol, que me ha pedido un tutorial para cambiar esos botones sociales para compar ...

general social

Cómo poner botones para redes sociales al final de tus entradas

Muchos Bloggers prefieren añadir botones para redes sociales al pie de sus entradas para que los usuarios puedan compartir el contenido que ha sido de su agrado. Vamos a aprender a colocar en el pie de entradas botones para compartir en Facebook, Twitter y Google+ nuestras creaciones.¿Qué son los botones para las redes sociales en un Blog?: Los componentes oficiales o no oficiales de las distinta ...

como hacer un blog

Bloquear boton derecho del raton en mi blog

Hola gente linda, Hoy vamos aprender a bloquear el botón derecho del ratón, para que nadie nos copie nuestros articulos o si deciden hacerlo que se les convierta en lidioso ese proceso, bueno empezamos para hacer esta operación vamos a ir a editar plantilla y buscamos </body> y antes de body pegamos el siguiente código: <script> // Inhabilitar el botón derech ...

recursos blog tutoriales

Tutorial: Boton "pin it" personalizado actualizado

Hola! hola!!! Hoy vengo a enseñarte un tutorial para personalizar tu blog, se trata del código html para poner el boton "pin it" pero personalizado. Si tu ya lo tenias puesto en el blog te habrás dado cuenta que desde hace tiempo ya no funciona, ya no te aparece la imagen que tenias puesta y no te deja pinear las fotos :( y eso se debe a que el javascript dejo de funcionar. Por lo visto ...

internet

IMPEDIR QUE COPIEN TEXTO DE SU PÁGINA EN BLOGGER

Para impedir que otros usuarios copien texto de su página web y la peguen en la de ellos, hay un par de códigos que nos van a servir. Existen dos códigos: (Se les agrega a <body>, es decir, antes de </body> que está al final de la plantilla) 1) PARA IMPEDIR QUE COPIEN SOMBREANDO CON EL MOUSE Y HACIENDO CLIC CON EL BOTÓN DERECHO <script language="Javascript" type="tex ...

rendimiento

Mejora el rendimiento de tu web con GTMetrix: Defer Parsing of Javascript

En Diarios de la nube vamos a ir ayudándote a resolver cada respuesta que GTMetrix pueda devolverte al analizar tu web. GTMetrix es un servicio de análisis rendimiento de la compañía de hosting GT.net. Es capaz de realizar los test más exigentes para analizar la velocidad de carga de todos los recursos de un sitio web, indicando así su velocidad de carga y localizando posibles "cuellos de bot ...

general social

Cómo poner botones para que te sigan en las redes sociales en Blogger

Poner botones para redes sociales con los que tus usuarios puedan seguirte te ayudará a incrementar la presencia de tus contenidos en Internet. Si bien muchas veces preferimos utilizar botones al final de nuestra entradas para que nuestros usuarios compartan si lo desean nuestras entradas, es importante también que puedan seguirnos por las redes sociales si así lo desean. Qué mejor sitio para que ...

general

Cómo crear un índice con todas las entradas de tu Blog que se genere automáticamente.

La generación de un índice de entradas automático para un blog es algo que muchos Bloggers anhelan utilizar en sus páginas: para crear índices con las recetas de cocina, con las películas y sus críticas, con las fotografías, los poemas, los escritos, las plantas, animales... un sinfín de conceptos que cada Blog maneja según su temática y que dada su cantidad es imposible exponer a los usuarios en ...

general ayuda blogger otros tutoriales

Como poner la barrita de cookies en blogger

No me suele gustar publicar sobre cosas que ya han sido publicadas tropecientas veces en otros lados. Ojo, seguro que lo hago, pues realmente no leo otros blogs sobre mi temática, pero si algo sé o intuyo que ya lo han publicado mil sitios más, pues trato de evitarlo, porque para qué. Si es algo tipo el post sobre si es mejor blogger o worpdress, pues sí, porque al final yo doy mi punto de vista ( ...

guías y tutoriales informática blogger ...

Poner el aviso de uso de cookies en nuestro blog

Hola amores!! La verdad es que en este país se inventan leyes y normativas bastante absurdas, y ahora les ha dado por la política de uso de los cookies. Y para que no nos caiga una multa del copón hay que poner un aviso en el que se informa a los lectores del blog que se está recopilando información de sus visitas, lo que ya he nombrado como cookies. ¿Y que son las cookies? Pues básicamente son ...