Como usar FBML en tus aplicaciones para facebook

Vimos hace poco como hacer nuestra primera aplicacion para facebook, un "Hola [tu nombre]". Era lo basico y vamos a seguir avanzando de a poco, a medida que vaya aprendiendo yo

Hoy quiero mostrarles como usar FBML. FBML es un lenguaje de etiquetas muy similar al HTML. El FBML es lo que nos va a permitir tener acceso a diferentes elementos del perfil y acciones de un usuario. Como es eso? Pues facebook por cuestiones de privacidad no permite que uno pueda acceder a datos de los usuarios, uno solo puede acceder a los ID de usuario. Y mediante ese ID mas FBML uno puede acceder a los otros datos del perfil (nombre, foto, amigos, etc etc) y solo desde una aplicacion que se ejecute en el mismo facebook. Es todo una cuestion de seguridad y muy buena segun yo.

Tenemos que recordar que nuestras aplicaciones estan alojadas en nuestros propios servidores y que facebook no nos da ningun alojamiento ni nada parecido, por lo tanto las bases de datos tambien las alojamos nosotros. Entonces a la hora de guardar algo deben guardar el ID de un usuario pues no tendran acceso al nombre, foto ni nada mas del usuario.

Ej: vamos a suponer que tenemos el ID de un usuario X que es 111222777 entonces...si en nuestra aplicacion quisieramos mostrar el nombre de esa persona hariamos asi:

<fb:name uid="111222777" />

O si por ejemplo quisieramos ver las foto de perfil de ese usuario hariamos asi:

<fb:profile-pic uid='111222777' />

Como veran no es dificil. No son muchas etiquetas. Y reciben parametros con las que podremos aprovecharlas mejor.

Veamos un ejemplo mas completo inspirado en un post de ikhuerta.

Vamos a usar el los mismos pasos que en mi tuto anteior. Solo vamos a cambiar el paso 9, el archivo index.php contendra lo siguiente:

<?php
// Llamar el archivo que contiene los parametros de configuración y obtine el id del usuario
require_once 'includes/facebook_config.php';

// Extraemos a un array los id's de todos sus amigos
$friends_ids = $facebook->api_client->friends_get();
?>
<!-- Mostrando foto del usuario logueado -->
<p>Hola! esta es tu foto: <fb:profile-pic uid="<?php echo $id_usuario; ?>" linked="true" /></p>

<!-- Mostramos las fotos de los amigos y nombres en una tabla-->
<table border=1>
	<tr>
		<td>Foto</td>
		<td>Nombre</td>
	</tr>
	<?php foreach ( $friends_ids as $friend_id ) {?>
	<tr>
		<td><fb:profile-pic uid='<?php echo $friend_id; ?>' linked='true' /></td>
		<td><fb:name uid='<?php echo $friend_id; ?>' /></td>
	</tr>
	<?}?>
</table>

Eso les va a mostrar primero tu foto y luego una tabla con las fotos y nombres de tus amigos. Algo asi:

Como usar FBML en tus aplicaciones para facebook

Muy sencillo. Espero sus comentarios y dudas.

Info del articulo
Comentarios
  • Tomi

    Hola! Yo queria que me ayudes con un tema de una Fan Page (Realmente no se como se llaman ahora, LIKE o algo asi xD) queria saber como hacer para que:
    Si estas unido a la pagina te muestre algo y si no, otra cosa
    Si podes contatame a mi mail
    Saludos

    • http://blogjapon.com.ar perro

      Desconosco como hacer eso Tomi

  • Melvin

    Este codigo funciona correctamente si lo ingreso en una pagina directamente , osea en un FBML Static ??

    Me entendio ?

    Muchas gracias

    • http://blogjapon.com.ar perro

      No, no entendi, explicame mejor. El codigo funciona perfectamente.

  • Mauro

    Gracias por el tutorial!

    Me pregunto lo mismo que Melvin, lo que quiero hacer es tener una pagina de fans de facebook. Pero cuando la gente se una que te muestre determinaba viñeta, pero cuando no este unida a la pagina (osea cuando no tocaron ‘me gusta’) que no les muestre esa determinada viñeta o pestaña.

  • Pingback: Adsense en facebook | Ganancias Adsense()

  • Juan

    Tengo una fan page, y quiero personalizar las pestañas. Hago todo el proceso tal y como se indica aquí, pero una vez que copio el código html y guardo los cambios, al acceder a esa pestaña, sale en blanco, como si no hubiera agregado nada.
    ¿Qué error puedo estar cometiendo o qué paso puedo haber omitido?

    • http://blogjapon.com.ar perro

      Que esto no es para usarlo en pestañas del tipo fan pages. Esto es para usarlo en aplicaciones para facebook.

  • Luis

    Hola Eduardo, tengo creada una pagina (comercial)en Facebook y quero usar FBML. Cuando accedo a través de aplicaciones y voy a agregar FBML Static, accedo a esa página pero no me muestra el botón “agregar a mi página” que debería aparcer abajo del logo (arriba a la izquierda)solo veo “añadir a los favoritos de mi página”, y no veo la forma de detectarlo. Estoy logeado con mi usausrio de Pages de facebook.

    Te agadezco una respuesta.Luis

    • http://blogjapon.com.ar perro

      Otra vez repito que esto no es para usarlo esto no es para usarlo en “fan pages”. Esto es para usarlo en aplicaciones hechas usando el API de facebook.

  • claudio

    hola:
    como puedo entra a esta aplicacion de fbml para publicar mi web y sea nabegable

  • http://www.todosuchi.com hector

    como saber el email de alguien con este codigo fbml
    ?????

  • Viviana

    Por favor, necesito ayuda : cuando yo, como administrador, en una página comercial en Facebook, posteo utilizando la API, se muestra como posteado por el administrador y no por la propia página, ¿es posible cambiar este estado a través de la API? He intentado muchas variaciones y no sé lo que puedo hacer. Gracias de antemano.