jueves, 18 de julio de 2013

Insertar botones compartir y me gusta de redes sociales


Hola, si buscas el modo de integrar botones "compartir", "me gusta", "+1" de redes sociales como twitter, facebook o google+ a tu web o blog a continuación podrás ver el código para cada uno de ellos ...

Botón de compartir en facebook ...
Sólo tendrás que cambiar http://www.tuweb.com/ por tu dirección web.
<a href="https://www.facebook.com/sharer/sharer.php?u=http://www.tuweb.com/" target="_blank"><img src="https://lh3.googleusercontent.com/-H8xMuAxM-bE/UefWwJr2vwI/AAAAAAAAEdY/N5I41q19KMk/s32-no/facebook.png"></a>


Botón de compartir en Twitter ...
Sólo tendrás que cambiar http://www.tuweb.com/ por tu dirección web.
<a href="http://www.twitter.com/home?status=http://www.tuweb.com/" target="_blank"><img src="https://lh5.googleusercontent.com/-xZVxH6CsUaQ/UefWwgi8o3I/AAAAAAAAEdk/reo5XS6z8-8/s32-no/twitter.png"></a>


Botón de compartir en Google+ ... 

Sólo tendrás que cambiar http://www.tuweb.com/ por tu dirección web.
<a href="https://plus.google.com/share?url=http://www.tuweb.com/" target="_blank"><img src="https://lh5.googleusercontent.com/-5Q7Sj0SXhOA/UefWwcrnZ-I/AAAAAAAAEdg/auK3wqGCbZE/s32-no/googleplus.png"></a>


Botón "me gusta" Facebook ... 

Sólo tendrás que cambiar http://www.tuweb.com/ por tu dirección web.
<iframe src="http://www.facebook.com/plugins/like.php?href=http://tuweb.com/&layout=button_count&show_faces=true&width=450&action=like&font=trebuchet+ms&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>


Botón  "+1" de Google+ ...


Código para botón Google+

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="medium"></g:plusone>


Para cambiar el tamaño del botón Google+ ...

<g:plusone size="small"></g:plusone> (para el cuadro pequeño, de 15x15 pixeles)
<g:plusone size="medium"></g:plusone> (para el cuadro mediano, de 20x20 pixeles)
<g:plusone></g:plusone> (para el cuadro estándar, de 24x24 pixeles)
<g:plusone size="tall"></g:plusone> (para el cuadro más grande, de 60x60 pixeles) 




Keywords: Botón, compartir, me, gusta, facebook, twitter, google+, código, html, blogger, blog, wordpress, web, insertar, redes, sociales 

1 comentario:

Jorge dijo...

Grandisimo post! Llevaba tiempo buscando como personalizar completamente los botones de compartir en las redes sociales y con esta ayuda creo que lo tengo todo. Lo probé y funciona muy bien.
Gracias!!!