Cómo implementar Facebook Connect en WordPress

22/04/2009

tutorialLo primero y principal, obviamente, es tener una cuenta en Facebook. Si no mal lo tenemos. xD A saber que realmente esto no es la panacea, si no una función que puedes implementar en tu blog para crear una especie de red social listando la gente que te lee. Pero realmente no es así, porque muchos de los que te leen quizá pasen de vincular su cuenta Facebook (por un motivo u otro) así que lo que tendrás ahí serán los lectores con los que mejor te llevas muy probablemente.

A mí me costó horrores hacerlo, pero es bien fácil. Realmente pasó que se me olvidó meter la dirección de mi blog donde debía meterla para que funcionara correctamente, y no hacía mas que decir que la aplicación no estaba correcta y no funcionaba. Me desesperé. xD

Obtención del plugin necesario

Esto se puede hacer a mano. De hecho, se facilita el código para poder hacerlo. Pero pienso que si lo tenemos en forma de plugin para WordPress es una tontería complicarnos la vida implementando un código que a golpe de un click ya tendremos implementado. El plugin en cuestión se llama Facebook Connect (en un alarde de originalidad, vaya), así que lo descargamos, que seguro que nos hace falta después.

Instalación

  • Lo primer debemos subir la carpeta que hemos descargado con el plugin a la carpeta plugins que encontraremos dentro de wp-content en la raíz de nuestro WordPress.
  • Ahora debemos entrar en la sección de Desarrolladores de Facebook, donde daremos autorización a la aplicación Developers para que podamos utilizarla.
  • Nos dirigimos a la zona donde podremos crear nuestra aplicación propia, le damos un título, marcamos que estamos de acuerdo y le damos a guardar cambios. Ahora nos aparecerá una ventana que dejaremos abierta porque pasos más adelante la necesitaremos.
  • Debemos acudir a la sección de plugins de nuestro Panel de Administración y activar el plugin Facebook Connector.
  • Nos vamos a la configuración del plugin en cuestión, que lo encontraremos en la sección de Opciones de nuestro Panel de Administración y allí se nos piden unos datos: clave API y número secreto. Las encontraremos en la página de nuestra aplicación en Facebook que anteriormente dejamos abierta.
  • El resto de opciones del plugin son personalizables por cada cual. Es indiferente en cuanto a configuración. Podemos elegir qué texto se mostrará en Facebook cuando alguien comente en nuestro blog y algunas cosas más. Cuando todo esté como queremos le damos a guardar configuración y el plugin automáticamente teniendo en cuenta los datos que le facilitamos configurará parte de nuestra aplicación.
  • Desde la ventana que dejamos abierta (recargamos por aquello de que el plugin ha hecho cosas por sí solo, y si no nos cargaremos sus cambios) podemos configurar nuestra aplicación. Desde el apartado básico podemos añadirle un logo, la descripción, nuestro correo, etc; podemos configurar todos los apartados si nos apetece (yo no lo hice), pero lo más importante es dirigirnos al apartado Connect y donde pone Connect URL escribir la dirección de nuestro blog (es lo que dije al principio que se me olvidó).
  • Ya solamente queda acudir a la sección de widgets de nuestra plantilla y añadir el widget del plugin donde queramos que se visualice. Si nuestra plantilla no tiene soporte para widgets (raro a estas alturas) podemos cargarlo manualmente mediante este comando: [code lang="php"][/code]

Nota final

Si todo ha salido bien no deberían haber ya más problemas. Todo debería funcionar correctamente y visualizarlo como ahora mismo se puede visualizar en este blog. Quizá con lo que más problemas puedas tener sea con el CSS a la hora de integrar el widget a tu plantilla, pero eso ya es teme aparte. A mí también me dio algo de dolor de cabeza. Si necesitas ayuda, ya sabes. Aunque no prometo mucho en cuanto a CSS se refiere ya que a mí, aunque acabe consiguiéndolo, también me cuesta.

Comentarios: 39 comentarios
Categorías: tutoriales
Etiquetas: -
Vota: bitacoras.com
Guarda: delicious
Envía: twitter - facebook
  • http://www.sociable.es Javier Reyes

    Gracias por utilizar el plugin y por el tutorial!

    • http://blog.fjp.es Javi

      Gracias a ti, Javier, que con el plugin es todo mucho más fácil. Gracias por pasarte por aquí.

      • http://www.facebook.com/profile.php?id=1514474824 Jorge Paco Monteagudo

        Gracias por el plugin Javier Reyes… WiZaRd, bien, ahora hay nuevos datos en facebook para completar en Connect… pero bueno…

      • http://www.facebook.com/profile.php?id=1514474824 Jorge Paco Monteagudo

        Otro datito: Que plugin usas para comentarios anidados?

        • http://blog.fjp.es Javi

          Es una opción que lleva ya implementada WordPress 2.7 (dentro del panel de administración, en opciones de discusión tienes la opción). Estoy preparando otro tutorial para ver cómo adaptar los comentarios de WordPress 2.6 a 2.7 en el que también se incluye la función de comentarios anidados. Un saludo.

          • http://www.deartistas.com Jorge Paco Monteagudo

            Gracias…

  • http://luisluque.es Luisma

    Joder, por fin!!! era eso lo que me faltaba, lo que a ti, que no habí­a puesto lo de la opción de Connect y mi blog xD DD. Bueno, más o menos ya lo he puesto.

    Una cosa, ¿como le haces para que te salga Editar perfil” en castellano? no consigo encontrar esa parte.

    • http://blog.fjp.es Javi

      Eso no se puede configurar desde ningún panel de administración, lo hice desde el código fuente. Lo tienes dentro de la carpeta del plugin en el archivo fbconnect_widget.php, línea número 13.

  • http://www.inkilino.com InKiLiNo

    Ostia tio como te lo has currao, eres mi idolo, ahora te propongo otro reto, conseguir que el plugin valide en W3C, je,je,je,je…

    PD: Este me esta costando al final quitaré el plugin y lo hare a mano con la API :P

    • http://blog.fjp.es Javi

      Oñe, ¿tú quieres acabar conmigo o qué? jajaja
      Ya vi ya, que tras pasar el test W3C habían un huevo de fallos. :(

  • http://www.inkilino.com InKiLiNo

    No hombre no, ni mucho menos, pero como yo no lo he conseguido a ver si tú… ;)

  • http://luisluque.es Luisma

    cucha, yo no tengo ese archivo!!

    • http://luisluque.es Luisma

      ya lo encontre xD D

      • http://blog.fjp.es Javi

        Ya decía yo que no podía ser que no estuviera si habías usado el mismo plugin. :P Por cierto, ¿has deshabilitado tú que salgan los avatares de los que te siguen? Es que no lo veo en tu blog.

  • http://www.facebook.com/profile.php?id=1026933043 Miguel García

    Tengo problemas para poder implementarlo. Ya hice todo al pie de la letra, pero al momento de poner Connect With Facebook, me pide los datos los introduzco, carga nuevamente la página y lamentablemente no salen los datos de perfil ni nada de eso, es decir dice otra vez Connect With Facebook.

    En resumen: No se conecta con Facebook, ojalá me puedas ayudar.

    Saludos!

    • http://www.inkilino.com InKiLiNo

      No ha salido la linea, es esta:

      <html xmlns=”http://www.w3.org/1999/xhtml” xmlns:fb=”http://www.facebook.com/2008/fbml”>

    • http://www.inkilino.com InKiLiNo

      Si has hecho todo lo que dice JAvi correctamente, entonces puede ser por que falte una línea en el header, concretamente esta:

      O por algún plugin de WordPress, desactiva todos los plugins un momento y lo pruebas.

    • http://blog.fjp.es Javi

      Hola Miguel: yo casi me declino más porque sea culpa de algún plugin que, por lo que sea, impide la correcta función de Facebook Connect. El enlace de tu comentario es un enlace a tu perfil de Facebook, cámbiatelo en el perfil para el próximo comentario o indícanos cuál es a ver si podemos saber algo más mirándote el header como dice InKiLiNo. Aunque por mi parte eso me lo hizo el plugin automáticamente.

      Ya nos dices algo.
      Saludos.

  • http://www.reflejados.cl Miguel Garcí­a

    Ya cambié el enlace a mi sitio. Es Reflejados.cl .

    Probaré desactivando algunos plugins para ver el funcionamiento. Lo del header lo hice apenas instalé el Facebook Connector.

    Saludos Pronto les cuento.

  • http://www.reflejados.cl Miguel Garcí­a

    Desactivé todos los plugins y probé, pero no pasó nada tampoco, ojala me ayuden.

    Saludos.

    • http://blog.fjp.es Javi

      Por lo que he probado, Miguel, ¿puede ser que tengas deshabilitado los registros de nuevos usuarios? Parece que lo que falla es a la hora de hacer un registro de nuevo usuario en tu blog.

  • http://vip-klan.ru Arianalulp

    Great! Thank you very much! I always wanted to write in my blog something like that. Can I take part of your post to my site? Of course, I will add backlink? Regards

    • http://blog.fjp.es Javi

      Yes, you can mention the article in your blog, remember link to the original author and no problem. Thanks!

  • http://www.facebook.com/profile.php?id=1417812120 Canario Tube

    Felicidades por el tutorial

    • http://blog.fjp.es Javi

      ¡Gracias! :)

  • http://yatengouniphone.com Montxi

    Yo ahi estudiandome la Api y too el cirio, y solo habia que poner el URL Conect, que es lo que me ha hecho perder una horita y media ahhhhhh..

    Mil gracias moceteeeeeeee!

    Montxi

    P.D.: Te pondré un enlace en el blog wiki que estoy preparando ;-) . Gracias otra vez!

    • http://blog.fjp.es Javi

      Justo es lo que me pasó a mí, y que también me dio un poco de quebradero de cabeza hasta que lo descubrí. xD

  • http://www.misviajes.org Juan

    Desactivé todos los plugins y probé, pero no pasó nada tampoco, ojala me ayuden.

    Saludos.

    Miguel pudiste solucionarlo???? me pasa lo mismo y me lleva un poco loco

    gracias

    • http://blog.fjp.es Javi

      Hola Juan. Tal como le comenté a él, que no llegó a contestarme, ¿puede que tengas inhabilitado el registro de nuevos usuarios? Si no es así no se me ocurre qué pueda ser. Podéis probar no obstante preguntando en el blog de los creadores del plugin.

  • http://www.misviajes.org Juan

    Si esta activado, creo que lo tengo todo bien, pero la verdad me esa volviendo loco. de todos modos gracias.

    • http://blog.fjp.es Javi

      Vaya, pues lo siento entonces. Si están hechos todos los pasos tal cual indico debería funcionar. Si no funciona no se me ocurre qué puede ser. Como dije, puedes probar a preguntar en el blog de los autores, a ver si ellos tienen alguna idea de qué pueda ser. Suerte, Juan.

  • http://www.latiendadereme.com Julio

    Esta aplicacion se puede utilizar en paginas comerciales???????

    • http://blog.fjp.es Javi

      Como te comenté por Twitter, no conozco ninguna restricción de ese tipo, así que sin problemas.

  • Maria

    Buenas,quisiera una ayudita con un problema que me trae de cabeza, pero es que no se donde guardar la main web en wordpress, porque se puede guardar en una carpeta aparte, me gustaria saber que procedimiento se sigue, paso a paso, para aprenderlo y comenzar a ir más fluida con el blog.
    Muchas gracias por lo que pueda ayudarme.
    Maria

  • http://www.pachakamaq.com Fliberty

    Hola he logrado enlazar mi blog con facebook después de haber leído varios tutos, y eso que he probado todos, jajajaja… El chiste es que cuando inicio sesión con facebook desde mi web, luego no puedo salir, supuestamente cuando le das clic a salir deberías cerrar la sesión pero esto no ocurre y si luego de varios intentos ocurre, me tira un error de servidor, no se a que se debe, también cuando inicio sesión con facebook tengo que volver a recargar la página para que me muestre la conexión realizada. Y por cierto como puedo hacer para los temas que publico en mi página se publiquen automaticamente en facebook sin que tenga que estar haciendo clic en el botón compartir… Muchas gracias…

    • http://blog.fjp.es Javi

      ¿Utilizaste el plugin Facebook Connect para WordPress para implementarlo? Si es así, a mí no me dio ninguno de esos problemas que comentas; en ese caso, lo mejor que puedes hacer es pasarte por la página de los creadores del plugin y comentarles los errores que tienes.

      En caso de que sea una implementación directa, sin ningún plugin, lamento no poder ayudarte porque no lo miré nunca (habiendo plugin es más fácil, jeje).

      Espero que se te solucione el problema.

      Un saludo.

  • http://www.depelicula.com.ve depelicula

    Buenas gracias por el tutorial, pero he hecho todo y cuando intento loguearme me dice

    “Error al cargar la página de De Película

    De Película está en construcción, por favor intenta mas tarde.”

    “Configuration errors:
    To fix this error, please set your Connect URL in the application settings editor. Once it has been set, users will be redirected to that URL instead of this page after logging in.”

    Agradeceria su ayuda al respecto!
    Gracias :D

  • http://www.bog.cyberchaps.com Hausser

    Creo que el tuto no esta completo, le falta muchas cosas, tego la nueva version 2.9 y marca error fatal al activarlo estaria mejor con imagenes y mas datos por que marca mucho errores, gracias de todos modos… saludos

    • http://blog.fjp.es Javi

      Con el plugin que comenté yo, como ves, lo tengo en WordPress 2.9 sin dar ningún error. ¿Te da error al activar el plugin? Si es así, en ese caso tendrás que comentárselo a los creadores del plugin para que le pongan remedio; aunque ya te digo que a mí no me da problemas.

      Suerte.