Social Login en WordPress con la cuenta de Facebook

¡Buenos días! En este vídeo-tutorial vamos a ver cómo conectar Facebook con nuestro WordPress para permitir el registro y el acceso a la web con la cuenta de Facebook. ¡Vamos allá!

YouTube video

La función de social login es muy popular en las webs que manejan muchos registros y logins, ya que permite acceder a la web sin tener que introducir de nuevo todas las credenciales necesarias.

En este caso nos centramos en cómo integrar el social login de Facebook en nuestro WordPress, pero el plugin que utilizamos nos permite integrar también otro tipo de cuentas como Twitter, Google, LinkedIn, etc. Veamos los pasos que hemos seguido.

Instalamos el plugin

El plugin utilizado en el vídeo se llama Nextend Social Login and Register, pero si tienes planeado sólo utilizar el social login de Facebook y no de otras redes, puedes utilizar este plugin más ligero, especializado en Facebook, que funciona de una manera parecida: Wp Facebook Login for WordPress.

Una vez instalado y activado el plugin vamos a configurarlo.

Configuramos el plugin de Social Login

Para conectar nuestro WordPress con Facebook nos vamos a Ajustes > Nextend Social Login > Facebook > Settings, y ahí el plugin nos pide dos datos para conectar nuestro WordPress. Vamos a conseguirlos en los siguientes pasos.

Creamos la aplicación en Facebook

Seguimos estos pasos:

  1. Nos dirigimos a Facebook Developers y añadimos una nueva aplicación.
  2. Le damos un nombre e indicamos un correo de contacto
  3. Hacemos click en Crear identificador de la aplicación
  4. En la siguiente ventana elegimos Integrar el inicio de sesión con Facebook y confirmamos.

Ahora ya tenemos disponibles los dos datos que nos pide el plugin, pero antes tenemos que configurar la aplicación para que funcione correctamente.

Configuramos la aplicación

Hay algunos datos que tenemos que rellenar en la pestaña de Configuración > Información básica de la aplicación, y son los siguientes:

  • Dominios de la aplicación: indicamos el dominio de nuestra web
  • URL de la política de privacidad y de las Condiciones del servicios: indicamos las URLs de nuestra web donde tenemos estos documentos
  • Categoría: elegimos la categoría que describe mejor nuestro producto o servicio

Podemos guardar los cambios y sólo nos falta una última cosa:

  1. En el panel de la izquierda, debajo de Productos nos vamos a Inicio de sesión con Facebook > Configuración
  2. En el campo URI de redireccionamiento OAuth válidos indicamos la URL de nuestra web seguido de un parámetro especial, tal que así: https://dominio.com/wp-login.php?loginSocial=facebook (no olvides de cambiar el dominio por tu dominio jeje).

Una vez hecho esto ya podemos activar la aplicación, en la esquina superior derecha, e introducir las credenciales que nos pide el plugin.

Introducimos las credenciales de la aplicación

  1. Volvemos a Configuración > Información básica
  2. Copiamos el Identificador de la aplicación y la Clave secreta de la aplicación y las pegamos en el campo correspondiente de la configuración del plugin (APP ID y App Secret, respectivamente)
  3. El resto de opciones de momento no nos interesan así que ya podemos guardar los cambios.

Últimos pasos

¡Y ya estamos! Lo último que nos pide el plugin son dos cosas:

  1. Verificar la configuración, con el botón Verify Settings que nos aparecerá al guardar las credenciales
  2. Habilitar el Social Login con Facebook, que hasta ahora se consideraba deshabilitado en tu WordPress.

Una vez hecho esto, si has seguido bien todos los pasos, si intentas acceder a tu web verás que ya te aparece la opción de acceder con la cuenta de Facebook 🙂


¿Eres una agencia o diseñador y necesitas un servicio profesional de maquetación web?
Tu web maquetada pixel-perfect en tiempo record con las mejores prácticas de desarrollo y optimización de velocidad
Servicio maquetación web