Vamos a usar el servicio de Sharethis para nuestros botones compartir, lo usamos porque tendremos la capacidad de poner varios botones con unos simples códigos y sin problemas. También usaremos tablas para mantener alineados nuestros botones.
Para poner los botones compartir flotantes usamos:
Insertamos el siguiente código CSS en el “Head” (<head>*</head>) de nuestra web:
1
2 3 4 5 6 7 8 |
<style type='text/css'>
table#btnflotante{ position:fixed; top:148px; right:6px; z-index:200; } </style> |
Justo a continuación insertamos el siguiente código Javascript:
1
2 |
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js">
</script> |
- Si deseas que los botones salgan a la izquierda cambia right por left del css
Como ejemplo dejamos los botones de Facebook, Twitter y Google+ ya insertados en nuestro código:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<table border='0' cellpadding='6' id='btnflotante'>
<tbody> <tr> <td> <div class='st_plusone_vcount'> </div> </td> </tr> <tr> <td> <div class='st_facebook_vcount'> </div> </td> </tr> <tr> <td> <div class='st_twitter_vcount'> </div> </td> </tr> </tbody> </table> |
Éste código deberás insertar en la sidebar o antes de </body> en nuestra web.
- Debes de insertar los códigos de tus botones entre <tr><td> y </td></tr> y puedes repetir para para la cantidad de botones que deseas poner.
Hello! I've been reading your website for a while now and finally got the courage to go ahead and give you a shout out from Lubbock Tx! Just wanted to mention keep up the great job!
ResponderEliminarMy blog - how to make apps