Cómo añadir un inicio de sesión de Facebook para WordPress ⋆ ALexHost SRL

Pon a prueba tus habilidades en todos nuestros servicios de Hosting y ¡obtén un 15% de descuento!

Utiliza el código al pagar:

Skills
15.01.2025

Cómo añadir un inicio de sesión de Facebook para WordPress

Si añades el inicio de sesión de Facebook a tu sitio web de WordPress, podrás agilizar el proceso de registro de usuarios, facilitándoles la inscripción o el inicio de sesión con sus credenciales de Facebook. Esto mejora la experiencia del usuario y puede aumentar su participación. Puedes conseguirlo con la ayuda de plugins y configurando una aplicación de Facebook para conectar tu sitio con el sistema de autenticación OAuth de Facebook.

Aquí tienes una guía paso a paso para añadir el inicio de sesión de Facebook a tu sitio de WordPress:


Paso 1: Crear una aplicación de Facebook

Para que los usuarios puedan iniciar sesión con Facebook, tienes que crear una aplicación de Facebook que se integre con tu sitio de WordPress.

1.1. Ir a Desarrolladores de Facebook

  1. Visita el sitio web de desarrolladores de Facebook.
  2. Si aún no tienes una cuenta de desarrollador de Facebook, se te pedirá que crees una.
  3. Una vez que hayas iniciado sesión, haz clic en Mis aplicaciones en la esquina superior derecha y, a continuación, haz clic en Crear aplicación.

1.2. Configurar la aplicación

  1. En la ventana emergente, seleccione Para todo lo demás y haga clic en Siguiente.
  2. Introduzca el nombre para mostrar de la aplicación, el correo electrónico de contacto de la aplicación y elija una cuenta de empresa (si procede).
  3. Haga clic en Crear aplicación.

1.3. Configurar inicio de sesión de Facebook

  1. En la barra lateral izquierda, haga clic en Añadir producto y seleccione Inicio de sesión en Facebook.
  2. Elige Web como plataforma.
  3. Introduce la URL de tu sitio web WordPress (por ejemplo, https://www.yoursite.com).

1.4. Obtenga el ID y el secreto de la aplicación

  1. Ve a Ajustes > Básico.
  2. Copie su App ID y App Secret. Los necesitará para configurar el plugin de WordPress más adelante.
  3. En App Domains, introduce tu nombre de dominio (por ejemplo, yoursite.com).
  4. En Valid OAuth Redirect URIs, añade la URL a la que se redirigirá a los usuarios después de iniciar sesión en Facebook, que normalmente tendrá este aspecto:
    https://www.yoursite.com/wp-login.php
  5. Haz clic en Guardar cambios.

Paso 2: Instalar un plugin de WordPress para habilitar el inicio de sesión en Facebook

Existen varios plugins que pueden ayudarte a integrar el inicio de sesión de Facebook con WordPress. Uno de los más populares es Nextend Social Login.

2.1. Instalar el plugin

  1. En su panel de WordPress, vaya a Plugins > Añadir nuevo.
  2. Busca Nextend Social Login.
  3. Haga clic en Instalar ahora y, a continuación, en Activar.

2.2. Configurar el plugin para Facebook

  1. Ve a Nextend Social Login en tu panel de WordPress.
  2. Haz clic en Facebook para iniciar el proceso de configuración.

2.3. Introduce tu App ID y Secret

  1. En la configuración del plugin para Facebook, pega el App ID y el App Secret que obtuviste del portal de desarrolladores de Facebook.
  2. Configura la URL de devolución de llamada en el mismo URI de redirección de OAuth válido que añadiste en la aplicación de Facebook (normalmente https://www.yoursite.com/wp-login.php).
  3. Configura cualquier otra opción que necesites (por ejemplo, botones, estilos o solicitudes de inicio de sesión).
  4. Haz clic en Guardar cambios.

Paso 3: Probar el inicio de sesión en Facebook

  1. Visita la página de inicio de sesión de tu sitio web o cualquier página en la que aparezca el botón de inicio de sesión.
  2. Ahora deberías ver el botón Iniciar sesión con Facebook.
  3. Haz clic en el botón y completa el proceso de inicio de sesión utilizando una cuenta de Facebook para asegurarte de que funciona correctamente.

Paso 4: Personalizar la experiencia de inicio de sesión en Facebook (opcional)

La mayoría de los plugins como Nextend Social Login ofrecen opciones para personalizar la apariencia y funcionalidad del botón de inicio de sesión de Facebook. Puedes modificar los siguientes ajustes:

  • Ubicación del botón: Elige dónde mostrar el botón de inicio de sesión de Facebook (en la página de inicio de sesión, en el formulario de registro o en la sección de comentarios).
  • Redirección de inicio de sesión: Decide dónde se debe redirigir a los usuarios después de iniciar sesión (por ejemplo, a su página de perfil o a la página de inicio).
  • Asignación de roles de usuario: Asigna automáticamente funciones específicas de WordPress (por ejemplo, suscriptor, autor) a los usuarios que inician sesión a través de Facebook.
  • Diseño y estilo: Personaliza la apariencia del botón de inicio de sesión para que coincida con el diseño de tu sitio web.

Paso 5: Activar el registro de usuarios a través de Facebook (opcional)

Si desea permitir que los nuevos usuarios se registren para obtener una cuenta en su sitio a través de Facebook, asegúrese de que el registro está habilitado en WordPress:

  1. Vaya a Configuración > General en el panel de control de WordPress.
  2. Marque la casilla Cualquiera puede registrarse en Membresía.
  3. Elige la función predeterminada para los nuevos usuarios (por ejemplo, Suscriptor).
  4. Guarde los cambios.

Una vez activada esta opción, los usuarios que no tengan una cuenta podrán registrarse a través de Facebook.


Conclusión

Añadir el inicio de sesión de Facebook a tu sitio de WordPress mejora la experiencia del usuario al ofrecerle una forma rápida y segura de iniciar sesión o registrarse. Creando una aplicación de Facebook y configurando un plugin como Nextend Social Login, puedes integrar perfectamente la autenticación de Facebook en tu sitio. Con las pruebas y la personalización adecuadas, el inicio de sesión en Facebook puede mejorar la participación de los usuarios y facilitar la gestión del acceso al sitio tanto para ti como para tus visitantes.

Pon a prueba tus habilidades en todos nuestros servicios de Hosting y ¡obtén un 15% de descuento!

Utiliza el código al pagar:

Skills