Botón de autenticación combinada

[Lilly (Lillian)]

	Resumen	Reemplaza los botones de autenticación predeterminados con un botón combinado que abre un menú desplegable o modal con enlaces
	Repositorio	https://github.com/Lillinator/combined-auth-button
	Guía de instalación	Cómo instalar un tema o componente de tema

Instalar este componente de tema

Descripción general

Este componente de tema combina los botones de registro e inicio de sesión en un solo botón con opciones desplegables, para un espacio de encabezado más limpio y una mejor experiencia de usuario (especialmente para usuarios móviles).

En particular, la vista predeterminada del foro móvil de Discourse oculta el botón de registro y solo muestra el botón de inicio de sesión existente; esto puede resultar confuso e poco intuitivo para los nuevos visitantes de los foros de Discourse (vista anónima). Además, el botón de inicio de sesión de la vista móvil predeterminada enlaza a la página de inicio de sesión que, a su vez, tiene un enlace a la página de registro; esto crea una fricción innecesaria para los nuevos usuarios en dispositivos móviles.

Vista móvil predeterminada sin el componente:

Este sencillo componente de tema de Discourse reemplaza el botón existente Iniciar sesión con un botón combinado con una etiqueta más clara: el predeterminado es Registrarse / Iniciar sesión. Al hacer clic o tocar, abre un menú desplegable o un modal móvil con enlaces a las respectivas páginas de registro o inicio de sesión.

Botón y modal móvil con la configuración predeterminada del componente:

Botón de escritorio y menú desplegable con la configuración predeterminada del componente:

---

Configuración y traducciones de temas

Hay configuraciones de administrador que permiten habilitarlo en el escritorio, ocultar el icono del botón combinado para tener más espacio en el encabezado en la vista móvil, así como cambiar todos los iconos y etiquetas de los botones.

Ajuste	Descripción
enable_on_desktop	Habilitar el botón de autenticación combinado en todos los tamaños de viewport
hide_mobile_combined_button_icon	oculta el icono del botón de autenticación combinado en la vista móvil para ahorrar espacio en el encabezado
combined_button_icon	Icono SVG para el botón desplegable de autenticación combinada
login_button_icon	Icono SVG para el botón Iniciar sesión
signup_button_icon	Icono SVG para el botón Registrarse
button_labels.auth	cadena de texto del botón combinado para traducciones de temas
button_labels.log_in	cadena de texto del botón de inicio de sesión para traducciones de temas
button_labels.sign_up	cadena de texto del botón de registro para traducciones de temas

---

Más capturas de pantalla

Página de configuración

Con hide_mobile_ combined_button_icon habilitado

Etiquetas e iconos de botones cambiados

Móvil:

Escritorio:

Personaliza tu foro para divertirte

---

Notas

• Este componente es compatible con el Menú hamburguesa lateral izquierdo en móvil, pero centrar el logotipo del sitio puede causar problemas de aglomeración en el encabezado.

---

Consulta mi otro contenido de Discourse

[Lilly (Lillian)]

Acabo de publicar una actualización que mejora la experiencia al abrir un modal en móviles que enlaza a las páginas de registro o inicio de sesión. También actualicé el OP. ¡Gracias a @Moin por la idea!

capturas de pantalla

Botones del modal del componente predeterminado:

Etiquetas de los botones personalizables:

[eisammy (Sammy)]

Muchas gracias @Lilly, lo probaré pronto.

[Lilly (Lillian)]

¡Hola! He realizado algunos cambios en este componente nuevamente: ahora se puede habilitar en el escritorio y cambiar todos los iconos.

[Lilly (Lillian)]

Hoy apliqué una pequeña corrección para este componente: el botón se estaba renderizando dentro del título de la cabecera en temas con desplazamiento cuando se usaba el componente de menú hamburguesa del lado izquierdo. Ahora los componentes son totalmente compatibles entre sí.