Botón compartir con AddThis
Me han pedido este tutorial por twitter y aquí vengo con él. ¿Habéis visto ese botoncito que hay al pie de las entradas a la derecha? Es un botón para compartir el post en el que se encuentra el botón. En la página de donde obtendremos el código, nos enseña a poner los botones para compartir en un widget flotante, pero a mí eso no me gustaba y prefería algo más discreto pero que se viese a su vez, por lo que investigué para poder ponerlo ahí abajo.
De la forma que comento anteriormente, tendrías que registrarte en la página y todo ese rollo que a nadie le gusta porque va a hacerlo sólo una vez, pero de esta forma, es sólo copiar y pegar el código que os voy a dar.
Antes que nada, haz una copia de tu plantilla, no queremos hacer destrozos y que no podamos volver atrás y recuerda, siempre haz vista previa.
Bien, vamos a buscar en nuestra plantilla lo siguiente:
<div class='post-footer-line post-footer-line-3'>
Y justo encima, pegamos esto:
<div align='right'><div class='addthis_toolbox addthis_default_style '>
<a class='addthis_button' href='http://www.addthis.com/bookmark.php'>
<img alt='Share' border='0' src='http://i57.tinypic.com/2ekkciu.png'/></a>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f5e34fc6406810b' type='text/javascript'/></div>
<!--This AddThis Button is brought to you by www.merysnotebook.com. Feel free to use and share, but please, keep this notice intact.-->
Si quieres cambiar el botón, sólo tendrás que cambiar lo que está en rojo por una imagen nueva, pero si lo que quieres es quitar la imagen y poner un texto, sólo tienes que sustituir lo que está en verde y rojo por el texto que quieras.
SIEMPRE, repito, siempre hay que hacer una vista previa antes de guardar.
Si en <div class='post-footer-line post-footer-line-3'> no logras ver el botón, o no te gusta porque está demasiado arriba, siempre puedes probar con <div class='post-footer-line post-footer-line-1'> o <div class='post-footer-line post-footer-line-2'>
A mí siempre me funciona en el 3. Cuando ya lo tengáis como os guste, y sólo entonces, podéis guardar la plantilla.
Y listo, ya tienes tu botón desplegable para que cualquiera que te lea pueda compartir tus entradas sin ningún tipo de complicación.
6 comentarios
Muchas gracias por el tuto! lo acabo de poner, pero no se como quitarle el borde que trae, he puesto en letras compartir, pero lo rodea un borde y no hay manera de quitarlo :(
ResponderEliminarBesos :*
Acabo de entrar a tu blog y no veo el borde, ¿lo has conseguido arreglar?
EliminarQue va María, sale el borde en Safari y Chrome, no sé porque la verdad :(
EliminarBesos :*
Muchas Gracias por el Turorial :DDD!!!!
ResponderEliminarEn breve compartiré yo otra manera, a ver si te gusta ;DD
Hola! Me he visto el tutorial y me ha encantado. Lo he puesto en mi blog de pruebas pero sabes, al querer compartir, no me comparte como tal el link de la entrada, sino el link del blog.
ResponderEliminar¿Tienes idea de por qué?
Hola espero que estes bien, a mi me gustaria tener los mismos que tienes tu puesto como hago para eso? saludos.
ResponderEliminarNo está permitido en este blog dejar enlaces en los comentarios. Tu nick es un enlace directo a tu perfil, donde si queremos, podemos visitar tu blog.
Somos librófagos, pero si haces spam también te comeremos.
En caso de no cumplir con esta norma, tu comentario será dirigido directamente a la carpeta SPAM.