Botón de leer mas para el stream de Google Plus en Blogger

Google Plus va adquiriendo cada vez mas preponderancia (yo al menos lo veo así) y debemos sacarle el máximo partido posible a sus posibilidades. Una de ellas es la posibilidad de interactuar en su stream, usando su API e insertando botones de llamadas a la acción (call to action) que pueden aumentar la efectividad de nuestras publicaciones en la plataforma.

Como ya hace tiempo que no os doy la vara con códigos os explico como hacerlo en Blogger por si queréis implementarlos en vuestros sitios.

.- El primer paso es darse de alta en la API de Google y crear un proyecto, en los servicios que os ofrece, seleccionar Google+ API (botón en on), aceptar los términos de servicio.

.- Una vez realizado el paso anterior, en la barra de la derecha pulsamos API Access y en la ventana que nos aparece pulsamos Create an OAuth 2.0 client ID...


.- Ahí rellenamos los datos, le ponemos un nombre (el que queramos) y en Home Page URL incluimos la url de nuestro sitio (importante poner las www si es como aparece en la pestaña del navegador la url de vuestro sitio).


Pulsamos next, seleccionamos Web application y en Your site or hostname (more options) incluimos de nuevo la url de nuestro sitio eligiendo (importante) http, no https, si no luego nos dará error (no olvidaros las www si las usáis). Pulsamos Create client ID


.- Ya tenemos creado nuestro acceso a la API y en la ventana que nos aparece es importante quedarnos con nuestro Client ID


Editamos nuestra plantilla de Blogger y antes de </body>

<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client:plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>

Y en vuestra plantilla, esto dependerá de cada plantilla y de donde queramos poner el botón pero como pista buscar footer1 por ejemplo y podéis insertar ahí el código que os indico a continuación

<button class='g-interactivepost' data-calltoactionlabel='READ_MORE' data-clientid='VUESTRO CLIENT ID COMPLETO (XXXXXXXXX.apps.googleusercontent.com)' data-cookiepolicy='single_host_origin' data-prefilltext='' expr:data-calltoactiondeeplinkid='data:post.url' expr:data-calltoactionurl='data:post.url' expr:data-contentdeeplinkid='data:post.url' expr:data-contenturl='data:post.url'>
TEXTO QUE APARECERA EN EL BOTON DEL BLOG
</button>

Con estos pasos cuando alguien pulsa el botón y comparta el contenido en Google Plus aparecerá un botón de Leer más en Google Plus. Aparentemente soporta el español como lengua pero aun no me ha dado tiempo a ver como implementarlo para que en vez de READ MORE aparezca LEER MAS, cuando lo mire, actualizare este post.

Luego el botón podéis customizarlo a vuestro gusto con CSS, así he dejado el mío

button {
float:right;
background: #304957;
margin: 10px;
padding: 10px;
color : #fff;
border: 0 !important;
cursor: pointer;
}

No solo podemos insertar un botón de Leer mas en el stream de Google Plus, hay muchas mas llamadas a la acción que podemos usar, y la base la tenéis reflejada en este post. Aun no he podido probarlo con Wordpress o Drupal pero solo se trata de modificar en el código la data de la URL dependiendo de como se denomina en cada plataforma.