Como poner el botón para compartir en Google + (Google Plus)

Luego del lanzamiento de Google +  ya son millones las personas que utilizan esta nueva red social por lo que sólo era cuestión de tiempo para que lanzaran el botón para compartir contenido.


Por eso ya podemos implementarlo en nuestra página web o nuestro blog, sólo tenemos que usar el código que prefiramos...

<!-- Place this tag where you want the share button to render. -->
<div class="g-plus" data-action="share" data-annotation="vertical-bubble" data-height="60"></div>
<!-- Place this tag after the last share tag. -->
<script type="text/javascript">
  window.___gcfg = {lang: 'es-419'};
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

<!-- Place this tag where you want the share button to render. --><div class="g-plus" data-action="share" data-annotation="bubble"></div>
<!-- Place this tag after the last share tag. --><script type="text/javascript">  window.___gcfg = {lang: 'es-419'};
  (function() {    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;    po.src = 'https://apis.google.com/js/plusone.js';    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);  })();</script>

<!-- Place this tag where you want the share button to render. --><div class="g-plus" data-action="share" data-annotation="none"></div>
<!-- Place this tag after the last share tag. --><script type="text/javascript">  window.___gcfg = {lang: 'es-419'};
  (function() {    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;    po.src = 'https://apis.google.com/js/plusone.js';    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);  })();</script>

<!-- Place this tag where you want the share button to render. --><div class="g-plus" data-action="share"></div>
<!-- Place this tag after the last share tag. --><script type="text/javascript">  window.___gcfg = {lang: 'es-419'};
  (function() {    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;    po.src = 'https://apis.google.com/js/plusone.js';    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);  })();</script>

Los botones de arriba son imágenes, no intentes probarlos :)


Si quieres que el botón se haga más pequeño tienes que agregar

data-height="15"

después de  data-action="share" y si lo que quieres es hacerlo más grande tienes que agregar

data-height="24" 

Sin duda, es un muy buen truco que podremos implementar fácilmente y que ayudará a que nuestros visitantes puedan compartir de una mejor manera el contenido de nuestra web.