24 Marzo 2021

Como instalar y configurar el login de Facebook en Drupal 8

Si estás aquí seguro que has pasado por varios sitios buscando como hacer la instalación y configurar el login de Facebook en Drupal 8.

Somos conscientes de los continuos cambios que Facebook realiza en su interfaz, por este motivo vamos a explicar en este artículo la versión más actual en solo 6 pasos documentados con imágenes que te ayudará a entender mejor el proceso. 

1. Descarga los módulos Composer o Drush

Como Drupalero seguro que ya conoces Composer o Drush, no vamos a profundizar en estos términos pero si te vamos a decir los módulos que necesitas descargar e instalar para cada uno de los módulos que elijas.

Si te decides por Composer, necesitas ejecutar las siguientes instrucciones:

  • "composer require drupal/social_api:1.x-dev"
  • "composer require drupal/social_auth:1.x-dev"
  • "composer require drupal/social_auth_facebook:1.x-dev"

Y si lo haces con Drush, entonces necesitas: 

  • "drush dl social_api"
  • "drush dl social_auth"
  • "drush dl social_auth_facebook"


2. Login en tu cuenta de Facebook

Abre Facebook y regístrate con tu contraseña.

3. Visita la url: https://developers.facebook.com/

Si es la primera vez que entras con tu cuenta de Facebook a la web de Facebook for Developers, en la barra de navegación, entra en Empezar.

Developers.facebook

Te pedirá un registro para verificar tu cuenta, como número de teléfono y correo electrónico donde te mandarán un código de verificación, es sencillo y solo tienes que seguir los pasos que te van indicando. 

Registro en facebook for developers

Para concluir este registro debes seleccionar una de las opciones que te muestra y con esto estaría completo este paso.

Selección final de registro facebook developers

4. Crear app

Como verás una vez terminado este registro, en la barra de navegación, donde antes te ponía Empezar ahora te pone Mis apps, clica en esta opción para empezar con el proceso.

descargar app developers facebook

Clica en el botón verde de Crear app

Crear app developers facebook

Selecciona la casilla Crear experiencias conectadas

Registro en facebook for developers

Completa los campos que te solicita, como el nombre con el que se mostrará tu app y el correo electrónico.

Registro en facebook for developers

Después se te abrirá este panel donde debes seleccionar Iniciar sesión con Facebook y configurar.

Registro en facebook for developers

En esta selección elige la plataforma Web.

Registro en facebook for developers

Y termina este paso poniendo tu dominio en el espacio de la URL y guarda.

Registro en facebook for developers

5. Configuración básica

Tienes que completar los campos que están marcados con el cuadro azul y en categoría, selecciona una de las opciones que te ofrece el desplegable. En Eliminación de datos de usuario es importante abrir el desplegable y seleccionar URL de instrucciones para la eliminación de datos.

Registro en facebook for developers

Más abajo completar el apartado URL del sitio.

Registro en facebook for developers

6. Inicio de sesión con Facebook configuración

Después ve al apartado de Inicio de sesión con Facebook en la barra de la izquierda y ve a Configuración.

En el apartado URI de redireccionamiento de OAuth válidos introduce el dominio, lo localizarás en la configuración de tu web, en el módulo de SOCIAL API SETTINGS, en el apartado de Facebook con el nombre Valid OAuth redirect URIs, una vez lo peques dale a la tecla intro y guarda los cambios, después pega esta misma dirección en Validador de URI de rendimineto, le das a intro y vuelves a guardas cambios. Aquí es importante hacer estos dos pasos así, ya que si pones las dos direcciones sin dar a intro y sin haber guardado la primera URI te dará un error. 

Registro en facebook for developers

7. Vinculación con la web

Vuelve a Configuración Básica para terminar con el proceso de vinculación, coge el número de identificador que te han facilitado y la clave secreta, para visualizar esta última, dale a mostrar, tendrás que meter tu contraseña de Facebook y te mostrará la clave secreta de la app, estos datos tienes que añadirlos en el bloque de Social Auth Facebook settings de tu web.

Registro en facebook for developers

Así se verá el bloque Social Auth Facebook setting, en Facebook Graph API version pon siempre 2.8 y guarda.

Registro en facebook for developers

8. Icono en la página de inicio

Para que aparezca el icono de registro con Facebook en tu página de inicio, tienes que ir a tu panel de administración, al apartado Estructura y seleccionas Diseño de bloque (https://midominio.com/admin/structure/block), buscas el bloque Social Auth Login y lo activas.

Registro facebook drupal 8

De este modo conseguirás hacer el registro de tu tienda web con Facebook en Drupal 8.

Como te comentaba al inicio del post, la web de desarrolladores de Facebook está en constante cambio, si utilizas nuestro post para hacer este registro y encuentras alguna diferencia, háznoslo saber en el formulario de contacto que te dejamos abajo y lo actualizaremos.

¿Te ha resultado útil este post?

Escríbemos para cualquier sugerencia o si quieres que profundicemos en algún tema relacionado con Drupal 8.

Acepto | He leído y acepto las Condiciones de uso y la Política de Privacidad.