Si tienes una web sabrás que es buena idea tener en sus páginas algún botón de Facebook. Gracias a estos botones, cuando alguien llega a alguna de las páginas de tu Sitio Web y la considera interesante puede compartirla con sus amigos. Esto es interesante para los usuarios y también para ti, porque se convierte en una forma de que tu web se haga más conocida.
Hasta ahora, Facebook disponía de dos botones básicos. Uno de ellos es ‘Me Gusta’ y el otro el botón de ‘Recomendar’. La diferencia entre uno y otro es básicamente la forma en la que se muestra información en el muro de la persona que pulse el botón.
En el caso de que alguien pulse el botón ‘Me gusta’, simplemente aparecerá una línea de texto en su Muro Facebook. En el caso del botón ‘Recomendar’ aparecerá una pequeña imagen (si está disponible) la URL que se recomienda y un pequeño resumen. Obviamente, la segunda opción es más llamativa y, por lo tanto, más efectiva.
Ahora Facebook pone a tu disposición una tercera opción, el botón ‘Enviar’ o ‘Send’. Este botón se perfila como una idea bastante interesante, porque te permite literalmente enviar la URL a una persona o a un grupo de ellas.
La forma en la que se envía la URL puede tener dos formas: una de ellas es enviar directamente al muro de la persona a quien recomiendas, por ejemplo, al recomendar WebGenio.com a un usuario, éste verá en su muro la recomendación que le has enviado.
La otra opción es el clásico e-mail. Al recomendar por e-mail, la recomendación llega directamente a la dirección de correo electrónico que hayas indicado.
Como verás, es una opción especialmente interesante para conseguir algo más de promoción utilizando Facebook que trasciende incluso al mundo del correo electrónico.
Ahora la pregunta és:
Cómo implementar el botón Enviar de Facebook en mi web
Implementar el botón ‘Enviar’ de Facebook es relativamente sencillo, pero requiere de algo de trabajo por tu parte. Puedes hacerlo de varias formas:
Implementar el botón Enviar desde Facebook
La forma más directa y, probablemente, más rápida, es accediendo a la página de plugins de Facebook y rellenando el pequeño formulario que encuentras a la izquierda:
En este formulario solo tienes que añadir la URL que quieres promocionar y luego seleccionar de forma opcional la fuente que quieres que se muestre y si prefieres colores claros u oscuros para que se adapten mejor al estilo de tu Web.
Cunando termines pulsa el botón ‘Get Code’ y copia y pega en las páginas de tu web el código que aparezca en pantalla.
Implementar el botón con una URL
Si quieres trastear por tí mismo y tener más control tienes otras maneras de implementar el botón de ‘Enviar’. Una de ellas es a través de un enlace normal y corriente hacia una URL con una estructura concreta similar a ésta:
http://www.facebook.com/dialog/send?app_id=123050457758183&name=WebGenio&link=http://webgenio.com
Como puedes ver, básicamente se trata de añadir una serie de parámetros a la URL facebook.com/dialog/send:
– name: el nombre de la página que quieres que se envíe
– link: la URL que quieres que se envíe
Aquí tendrías que añadir el título y URL de la página de tu sitio web donde añadas el botón, obviamente, el enlace va dentro de una etiqueta HREF enlazando alguna imagen o un texto. Si no sabes qué es un HREF quizás podrías aprender algo de HTML o bien saltar a la siguiente sección de este tutorial donde se explica una forma más directa de hacerlo.
De esta forma tienes un enlace básico que ya es funcional, pero todavía puedes refinarlo más añadiendo algún otro parámetro:
– description: una pequeña descripción
– picture: la url de una imagen pequeña o thumbnail
– to: aquí puedes añadir usuarios adicionales a quienes irá enviado el mensaje automáticamente
– redirect_uri: la URL a la que se redireccionará el usuario cuando termine de enviar el enlace que está recomendando.
Por ejemplo:
http://www.facebook.com/dialog/send?app_id=123050457758183&name=WebGenio&link=http://webgenio.com&description=Web%20y%20software&redirect_uri:http://webgenio.com
En el ejemplo anterior, el usuario recomienda WebGenio.com y su recomendación aparecerá con la descripción que se indica (Web y software). Una vez enviado el mensaje, el usario vuelve a webgenio.com
Implementar el botón con JavaScript SDK
Otro sistema si cabe más sencillo y efectivo es utilizando el JavaScript SDK de Facebook, para ello solo tienes que añadir un código específico y nada más. Después de esto obtienes automáticamente un botón al estilo Facebook y una mini-pantalla desplegable en un iframe, así que el usuario ni siquiera sale de tu página para recomendarla:
<script src=”http://connect.facebook.net/en_US/all.js”></script>
<div id=”fb-root”></div>
<script>
// assume we are already logged in
FB.init({appId: ‘123050457758183’, xfbml: true, cookie: true});
FB.ui({
method: ‘send’,
name: ‘WebGenio’,
link: ‘http://webgenio.com’,
});
</script>
Como verás, puedes utilizar los mismos parámetros que los utilizados en el punto anterior, pero debes insertarlos de forma diferente:
name: ‘WebGenio’,
link: ‘http://webgenio.com’,
Como nota importante recuerda que debes modificar el código html de tu página web para que funcione el SDK de ésta forma:
En la cabecera de tu sitio web, donde aparece:
<html>
Debes substituirlo por:
<html xmlns:fb="http://www.facebook.com/2008/fbml">
Utilizar el botón Enviar de Facebook en WordPress
Si estás leyendo esto, es posible que tengas tu propio sitio web, pero es todavía más probable que tengas un blog con algún CMS como WordPress. En éste caso, también puedes utilizar estos códigos, pero te encontrarás con el problema de que cada post tiene una URL y un título diferentes, así que necesitas realizar algunos cambios.
Cuando añadas el botón de Enviar de Facebook en tu tema WordPress activo, solo tienes que asegurarte de añadir éstas funciones predefinidas de WordPress:
Donde quieras que aparezca el título: the_title();
Donde quieras que aparezca la URL: the_permalink();
Por ejemplo:
name: ‘<?the_title(); ?>’,
link: ‘<?the_permalink(); ?>’,
o también:
<div id=”fb-root”></div><script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script><fb:send href=”<?the_permalink(); ?>” font=””></fb:send>
De esta forma, WordPress sabe automáticamente que quieres añadir el título de la página y la URL correspondiente sin que tengas de preocuparte de modificarlo a mano página por página.
En Resumen
Utilizar un sistema u otro depende de cada uno, el basado en un enlace simple es más rápido a la hora de cargar las páginas de tu web o blog. El resto son más efectistas visualmente y evitan que el usuario tenga que abandonar la página. En general, si solo vas a añadir un botón puedes usar el SDK, si vas a utilizarlo en un blog lo mejor es que utilices la URL simple.
Información oficial en Facebook