Cómo agregar un inicio de sesión de Google con un clic en WordPress (paso a paso)

How to Add One-Click Login With Google in WordPress

¿Quiere agregar un inicio de sesión con un clic con Google a su sitio de WordPress?

Cuando sus usuarios pueden iniciar sesión con su cuenta de Google, no tienen que crear, recordar o rastrear otro nombre de usuario y contraseña solo para acceder a su sitio. Esto les ayuda a ahorrar tiempo y aumentar sus tasas de conversión.

En este artículo, le mostraremos cómo agregar fácilmente el inicio de sesión de Google con un clic en WordPress.

Cómo agregar un inicio de sesión con un clic con Google en WordPress

¿Por qué agregar un clic de inicio de sesión de Google en WordPress?

Muchos usuarios de Internet permanecen conectados a sus cuentas de Google. Esto les brinda acceso rápido a las aplicaciones de Google como Gmail, Drive y Docs sin tener que iniciar sesión para cada aplicación individualmente.

Si Google One-Click Login está habilitado en su página de inicio de sesión de WordPress, sus usuarios pueden hacer lo mismo en su sitio. Pueden ahorrar tiempo iniciando sesión rápidamente con su cuenta de Google. Esto le evita tener que volver a ingresar sus datos de inicio de sesión cada vez.

Si ejecuta un blog simple de WordPress, es posible que esta función no le resulte útil.

Sin embargo, si su organización usa Google Workspace para el correo electrónico del trabajo, los miembros de su equipo pueden usar las cuentas de Google Apps de su organización para iniciar sesión.

Además, la función de inicio de sesión único como Google One-Click Sign-In es muy útil para todos los sitios web que requieren que los usuarios inicien sesión, como: B. Sitios de varios autores, sitios de membresía y sitios que venden cursos en línea.

Echemos un vistazo a cómo puede agregar fácilmente el inicio de sesión con un clic con Google a su sitio web de WordPress.

Cómo agregar un inicio de sesión de Google con un clic en WordPress

Primero necesitas instalarlo y activarlo. Inicio de sesión y registro de Nextend Social enchufar. Consulte nuestra guía para principiantes sobre cómo instalar un complemento de WordPress para obtener más detalles.

Para este tutorial, usaremos el complemento gratuito que admite el inicio de sesión de Google, Twitter y Facebook. También hay una versión paga de Nextend Social Login, que agrega inicio de sesión social para muchos sitios web diferentes, incluidos PayPal, Slack y TikTok.

Después de la activación, debe ir Configuración » Inicio de sesión social de Nextend en el área de administración de WordPress. En esta pantalla, verá las diferentes opciones de inicio de sesión social disponibles.

Agregar inicio de sesión social a su sitio web de WordPress

Para agregar un inicio de sesión de Google a su sitio web de WordPress, debe hacer clic en el botón "Comenzar" debajo del logotipo de Google.

Aquí puede ver que su primer paso es crear una aplicación de Google.

Crear una aplicación de Google suena técnico, pero no te preocupes.

La sección

No necesita saber ningún código y lo guiaremos a través de todos los pasos.

Crear una aplicación de Google

Para crear esta aplicación, debe cambiar entre el panel de control de WordPress y la Consola para desarrolladores de Google. Es una buena idea dejar el panel de control de WordPress abierto en la pestaña actual y abrir una nueva pestaña del navegador.

Ahora puedes visitarlos Consola de desarrolladores de Google sitio web. Si aún no ha iniciado sesión, se le pedirá que inicie sesión con su cuenta de Google.

Luego debe hacer clic en "Seleccionar proyecto" en el menú superior. Se abrirá una ventana emergente, haga clic en el botón "Nuevo proyecto" para continuar.

Crear un nuevo proyecto en Google Developers Console

Esto abrirá la página Nuevo proyecto. Debe agregar un nombre de proyecto y seleccionar una ubicación. El nombre del proyecto puede ser cualquier cosa, p. B. Inicie sesión en Google.

Si inicia sesión con una cuenta de Google Workspace, la ubicación se completará automáticamente con el nombre de su organización. Si no, deberías dejarlo desorganizado.

Dale al proyecto un nombre y una ubicación.

Luego haga clic en el botón Crear para continuar.

Ahora será redirigido al panel de API y servicios. En esta página, debe hacer clic en "Pantalla de consentimiento de OAuth" en el menú de la izquierda.

Decide si tus usuarios son internos o externos

Aquí selecciona el tipo de usuario que permite iniciar sesión.

Seleccione Interno si desea solo los usuarios con la cuenta de Google de su organización pueden iniciar sesión. Alternativamente, seleccione "Externo" si sus usuarios tienen direcciones de correo electrónico fuera de su organización. Por ejemplo, cualquier persona con una cuenta de @gmail.com frente a una dirección de @yourcompanyemail.com.

Si desea continuar, haga clic en el botón "Crear". Ahora puede comenzar a agregar información a su aplicación.

Añade información sobre tu aplicación de Google

Primero, debe ingresar el nombre de su empresa en el campo de nombre de la aplicación. Esto se muestra al usuario al iniciar sesión, p. B. "Smith Training Services quiere acceder a su cuenta de Google".

También debe agregar la dirección de correo electrónico que utilizó para registrarse en Google. Esto permite a sus usuarios hacer preguntas sobre la pantalla de inicio de sesión de Google.

Cima: Le recomendamos que no cargue un logotipo para su aplicación. En este caso, su aplicación debe pasar por un proceso de revisión con el equipo de confianza y seguridad de Google. Este proceso es largo y puede tomar de 4 a 6 semanas.

Luego, desplácese hacia abajo hasta la sección Dominio de la aplicación. Aquí debe agregar enlaces a la página de inicio de su sitio, la página de política de privacidad y la página de términos de servicio.

Agregar enlaces a estos sitios web importantes

A continuación, debe hacer clic en el botón "Agregar dominio" para agregar el nombre de dominio de su sitio web, p. p.ej. "ejemplo.com".

Si desea agregar un inicio de sesión de Google con un clic a más de un sitio web, puede hacer clic en el botón "+ Agregar dominio" para agregar otro dominio.

Agregue el dominio y la dirección de correo electrónico de su sitio web

Finalmente, debe agregar una o más direcciones de correo electrónico para que Google pueda notificarle los cambios en su proyecto.

Cuando haya terminado, no olvide hacer clic en el botón "Guardar y continuar".

A continuación, accederá a las páginas Ámbitos y Usuarios de prueba. Para estas dos páginas, simplemente desplácese hacia abajo y haga clic en el botón "Guardar y continuar".

Haga clic en las páginas Espacios y Usuarios de prueba. Haga clic en Guardar y continuar.

La página final de este paso le muestra un resumen de su configuración en la pantalla de consentimiento de OAuth.

La siguiente tarea es crear las claves que su complemento necesita para conectarse a Google Cloud.

Debe hacer clic en "Credenciales" en el menú de la izquierda y luego hacer clic en el botón "+Crear credenciales" en la parte superior de la pantalla. Debe seleccionar la opción ID de cliente de OAuth.

Haga clic en Crear credenciales y seleccione el ID de cliente de OAuth

Esto lo llevará a la página Crear ID de cliente de OAuth.

Debe seleccionar "Aplicación web" en la lista desplegable "Tipo de aplicación".

Seleccione Aplicación web como tipo de aplicación

Algunas configuraciones se agregan a la página. Desplácese hacia abajo hasta la pestaña URI de redireccionamiento autorizado y haga clic en el botón + Agregar URI.

Ahora necesitas ingresar esta URL:

http://example.com/wp-login.php?loginSocial=google

Asegúrate de reemplazar example.com con su propia dirección de sitio web.

Coloque esta URL en URI de redireccionamiento autorizado

Después de hacer esto, debe hacer clic en el botón "Crear" para guardar la configuración. La configuración puede tardar entre cinco minutos y varias horas en surtir efecto.

¡Su cliente OAuth ya está creado!

Verá una ventana emergente con "Su ID de cliente" y su Secreto de cliente. Debe colocar estas claves en la página de configuración del complemento en su administrador de WordPress.

Simplemente puede hacer clic en el icono de copia a la derecha para copiar las claves una por una.

Ahora verá su ID de cliente y Secreto de cliente

Agregar sus claves de Google a su complemento

Ahora simplemente regrese a la pestaña del navegador de su sitio y haga clic en la pestaña "Configuración" en la parte inferior. Ajustes » Siguiente inicio de sesión social. Aquí verá campos para ID de cliente y Secreto de cliente.

Debe copiar y pegar sus claves de Google Cloud Console en estos campos.

Ingrese su ID de cliente de Google y el secreto del cliente en la configuración del complemento

Una vez que haya hecho esto, asegúrese de hacer clic en el botón "Guardar cambios" para guardar su configuración.

Ahora debe verificar si la configuración funciona correctamente. Esto es importante porque no desea que los usuarios reales encuentren errores cuando intentan iniciar sesión en su sitio web.

Haga clic en Comprobar configuración para asegurarse de que la aplicación de Google funciona correctamente.

Simplemente haga clic en el botón "Comprobar configuración" y el complemento se asegurará de que la aplicación de Google que creó funcione correctamente.

Si siguió los pasos anteriores correctamente, debería ver una notificación que dice "Funcionando bien - deshabilitado".

Debería ver una notificación que dice

Ahora puede hacer clic con seguridad en el botón "Activar" para permitir que los usuarios inicien sesión con su ID de Google.

Verá un mensaje que confirma que el inicio de sesión de Google ahora está habilitado.

Clic en el botón

Elegir el estilo y las etiquetas de los botones

El estilo y la etiqueta del botón predeterminado de Nextend son bastante estándar y funcionan para la mayoría de los sitios web. Sin embargo, puede personalizarlos haciendo clic en la pestaña Botones en la parte superior de la pantalla.

Ahora verá todos los diferentes estilos que puede usar para el botón de inicio de sesión social. Para usar un estilo diferente, simplemente haga clic en el botón de radio apropiado.

Seleccione una máscara haciendo clic en el botón de selección

Una vez que haya hecho esto, también puede cambiar el texto del botón editando el texto en el campo Etiqueta de inicio de sesión.

Si lo desea, puede aplicar un formato básico a la etiqueta de inicio de sesión mediante HTML. Por ejemplo, puede poner el texto en negrita <b> y </b> palabras clave

Puede personalizar las etiquetas de los botones y el botón

También puede editar los campos Etiqueta de enlace y Desvincular, que permiten a los usuarios asociar y desvincular su sitio con sus cuentas de Google. Los usuarios técnicos pueden usar el código HTML del botón para crear su propio botón de inicio de sesión de Google.

Asegúrese de hacer clic en el botón "Guardar cambios" para guardar su configuración.

Saca tu aplicación de Google del modo de prueba

Ahora hay una última cosa que hacer en la pestaña del navegador Google Cloud. Aún debería ver la ventana emergente con su ID de cliente y Secreto de cliente. Puede cerrar la ventana emergente haciendo clic en Aceptar en la parte inferior de la ventana emergente.

Ahora debe hacer clic en "Pantalla de consentimiento de OAuth" en el menú de la izquierda.

Como puede ver, su aplicación de Google está en modo de prueba. Esto le permite probar su aplicación con un número limitado de usuarios. Una vez que reciba una notificación de "Funcionamiento bien" mientras verifica la configuración con el complemento, puede moverlo al modo "En producción".

Haga clic en Publicar la aplicación para ponerla en modo de producción.

Haga clic para ello, haga clic en el botón Publicar aplicación. Luego verá una ventana emergente titulada "¿Empujar a producción?".

Simplemente haga clic en "Verificar" para permitir que cualquier persona inicie sesión en su sitio con un inicio de sesión de Google en un solo paso.

Ahora haga clic en el botón Confirmar

Si siguió este tutorial cuidadosamente, el estado de verificación ahora debería decir No se requiere verificación.

Su aplicación ahora funcionará con todos los usuarios de Google.

Su estado de verificación debe decir No se requiere verificación

Ahora, cuando los usuarios ingresan a su sitio, tienen la opción de iniciar sesión en Google.

Sin embargo, si lo prefieren, aún pueden iniciar sesión con su nombre de usuario y contraseña predeterminados de WordPress.

Vista previa de inicio de sesión de Google

Tenga en cuenta que los usuarios solo pueden iniciar sesión con la dirección de la cuenta de Google que usaron en su sitio. Si ha habilitado el registro de usuarios en su sitio de WordPress, los usuarios también pueden registrarse rápidamente con Google en su sitio con un solo clic.

Si desea agregar el botón Iniciar sesión de Google en otro lugar de su sitio web, puede hacerlo con un código abreviado. Puede obtener más información haciendo clic en la pestaña Uso de Nextend.

Agregue un botón de inicio de sesión de Google con un código abreviado

Esperamos que este artículo le haya ayudado a aprender cómo agregar un inicio de sesión con un clic con Google en WordPress. También puede querer aprender cómo crear un sitio de membresía de WordPress y consultar nuestra lista de los mejores complementos de WordPress para directorios comerciales.

Si te ha gustado este artículo, suscríbete al nuestro. canal de Youtube para tutoriales en vídeo de WordPress. También puedes encontrarnos en Closermarketing.es y Facebook.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir