Siguiendo la linea del anterior capitulo sobre como compartir contenido en Facebook vamos a ver ahora como realizar un botón con la misma función pero para Twitter.

En la propia página de Twitter hay un sitio donde se pueden conseguir botones para sugerir a las personas que visitan tu sitio que sean seguidores de tus contenidos en Twitter, como se puede ver en la página de Botones de Twitter. Pero lo que nosotros queremos conseguir es que las personas que nos visitan puedan enviar referencias a los artículos de nuestra página, para actualizar los "status" de las cuentas de Twitter de los usuarios. Dicho de otra manera, queremos mostrar en los artículos un botón para que las personas que los leen lo envíen a Twitter. Además, veremos cómo resolver el problema de enviar URLs muy largas. Esto se puede hacer utilizando algunas de las funcionalidades del API de Twitter.

El sistema de creación es bien sencillo ya que tan solo tenemos que crear la url de una forma muy parecida a como lo hacíamos para facebook.

Para hacer un botón en tus artículos, puedes hacerlo con un enlace que se dirija a una URL en concreto.

http://twitter.com/home?status=http://www.midominio.com

Dentro de esa URL, en el parámetro "status" podemos indicar, aparte de la URL del sitio o el artículo que queremos que los usuarios carguen en su status, un texto que sirva para especificar alguna acción, por ejemplo:

http://twitter.com/home?status=leyendo%20http://www.midominio.com

Tener en cuenta que lo que se escriba en el campo status, para asegurarnos que llegue correctamente a Twitter, tiene que ir codificado en formato URL, por eso hemos convertido el espacio en la cadena "%20" o por un signo más "+". Pero este no es el único carácter que deberíamos convertir. Hay otros caracteres que también deben codificarse para que se transfieran bien por una URL y para ello podríamos utilizar alguna función como urlencode() de PHP o encodeURIComponent() de Javascript.

PHP:

<a href="http://twitter.com/home?status=<?php echo urlencode("Leyendo http://www.desarrolloWeb.com/css en DesarrolloWeb.com.");?>">Compartir en Twitter</a>

Javascript:

<script>
document.write('<a href="http://twitter.com/home?status=' + encodeURIComponent("Leyendo http://www.desarrolloWeb.com/css en DesarrolloWeb.com.") + '"><img src="logo_twitter.gif" alt="Comparte esto en Twitter" /></a>');
</script>

Problema al enviar URLs largas al status de Twitter

El problema viene porque twitter no admite un número elevado de caracteres para los post a publicar y a menudo las URLs de los sitios web contienen cadenas muy largas que pueden hacer sobrepasar ese límite.

Por este motivo es aconsejable en muchos casos utilizar algún sistema que permita acotar las URLs de nuestro sitio, para que el usuario pueda componer su post con mayor facilidad y con la posibilidad de agregar algún texto sin pasarse de los 140 caracteres que permite Twitter. Una de las posibilidades para generar URLs cortas es utilizar el API de bit.ly que ya comentábamos en un manual en Desarrolloweb.com

Lo primero que vamos a hacer es crear el enlace para compartir nuestro contenido.

<a href="http://twitter.com/home?status=Leyendo ' . $nombre_articulo . ' en '. $url .'" class="btwitter" title="Compartelo en Twitter"><img width="43" height="31" src="iconotwitter.png"></a>

Como veis tan sólo hay que poner el nombre del contenido que queremos compartir, la ruta de la imagen donde tenemos el icono de twitter que vamos a colocar y la url de la página.

Esto nos funcionará perfectamente siempre y cuando las URL que le pasemos sean cortas, del tipo http://www.mipaginas.com/index.php o http://www.mipagina.com/contactar.html pero si tenemos urls del tipo http://www.mipagina.com/manual/articulo-prueba/almacen-secundario/articulo-prueba-final-twitter-2542529784258812874-htlshquemd-526554614654654654654.html posiblemente nos de un error ya que twitter no permite urls de más de 140 caracteres.

Por este motivo vamos a realizar una serie de acciones sobre la URL antes de pasarla al enlace de Twitter.

Acortar una dirección para actualizar el status de Twitter

Lo primero es ver nuestras variables necesarias para trabajar con el API de bit.ly

$servicio_web = "http://api.bit.ly/";
$version_API = "version=2.0.1";
$usuario = "login=usuario"; //sustituye por tu usuario del API
$llave = "apiKey=R_clave"; //sustituye por tu clave del API
//la URL que quiero acortar
$URL_larga = "url_larga";

A continuación vamos a codificar la url larga

$query_URL = "&longUrl=" . urlencode($URL_larga);

y genero la URL para consultar en el API de bit.ly

$URL_consulta_API = $servicio_web . "shorten?" . $version_API . "&" . $query_URL . "&" . $usuario . "&" . $llave;

Leemos lo que me devuelve el API al hacer esa consulta, que estará en formato JSON

$respuesta_API = file_get_contents($URL_consulta_API);

Lo que nos queda ahora es consumir ese JSON para convertirlo en una estructura de datos accesible desde PHP

$respuesta_API = json_decode($respuesta_API, true);
//el true anterior hace que json_decode me devuelva sea un array asociativo.

Para mostrar la URL utilizamos la siguiente notación

$respuesta_API["results"][$URL_larga]["shortUrl"]

Con esto ya tenemos nuestra URL lista para colocarla en nuestro enlace de la siguiente forma.

<a href="http://twitter.com/home?status=Leyendo ' . nombre_articulo . ' en '.$respuesta_API["results"][$URL_larga]["shortUrl"].'" class="btwitter" title="Compartelo en Twitter"><img width="43" height="31" src="/images/iconotwitter.png"></a>

Pero recordar que tendríamos que utilizar alguna función para codificar en formato URL la cadena a enviar al status, en el siguiente código completo veremos como implementar este último detalle:

$servicio_web = "http://api.bit.ly/";
$version_API = "version=2.0.1";
$usuario = "login=usuario"; //sustituye por tu usuario del API
$llave = "apiKey=R_clave"; //sustituye por tu clave del API

//la URL que quiero acortar
$URL_larga = "http://www.desarrolloweb.com/manuales/";
$titulo_articulo = "Manuales de DesarrolloWeb.com";

$query_URL = "&longUrl=" . urlencode($URL_larga);
$URL_consulta_API = $servicio_web . "shorten?" . $version_API . "&" . $query_URL . "&" . $usuario . "&" . $llave;
$respuesta_API = file_get_contents($URL_consulta_API);
$respuesta_API = json_decode($respuesta_API, true);

$enlace_twitter = '<a href="http://twitter.com/home?status=' . urlencode('Leyendo ' . $titulo_articulo . ' en ' . $respuesta_API["results"][$URL_larga]["shortUrl"] .'.') . '" class="btwitter" title="Compártelo en Twitter"><img width="43" height="31" src="/images/iconotwitter.png" alt="compártelo"></a>';

echo $enlace_twitter;