El momento en que los usuarios inician sesión en SAP Fiori Launchpad es fundamental, ya que define la experiencia inicial del usuario con el sistema.

En los casos en que los clientes solo utilizan la autenticación básica (es decir, la autenticación a través del usuario y la contraseña), esta experiencia inicial proviene de la página de inicio de sesión estándar que proporciona la clase estándar /UI2/CL_FIORI3_LOGIN. Es posible que esta clase estándar no se adapte a sus requisitos de marca personalizados, por lo que es necesario ampliar esta página de inicio de sesión.

¿Por qué es necesario?

En este escenario, al utilizar la autenticación básica, desea deleitar a sus usuarios desde su primera interacción con el sistema y desea mostrar un diseño de página agradable que transmita una sensación de innovación, por ejemplo:

Ejemplo de página de inicio de sesión

¿Cómo lograr esta modificación?

En general, las modificaciones requeridas implican la creación de una clase personalizada que redefine el método: INIT_DEFAULT_PROPIEDADES de la clase estándar /UI2/CL_FIORI3_LOGIN. En este método redefinido, podemos ajustar los valores de propiedad o incluir clases CSS personalizadas, código JS o imágenes que se han cargado en el repositorio MIME como objetos personalizados.

Arquitectura de desarrollo

Múltiples autores han cubierto este requisito de extensión, todos ellos con enfoques válidos, por ejemplo:

¿Por qué necesitamos un nuevo blog que hable de este tema?

Realmente no lo necesita, además, la documentación de SAP se ha actualizado para reflejar las mejores prácticas para ampliar la página de inicio de sesión: Personalización de la pantalla de inicio de sesión

Lo que realmente podría necesitar es un documento de ejemplo que detalle todos los pasos y opciones para personalizar la página de inicio de sesión. Por ejemplo:

• Cómo agregar archivos al repositorio MIME
• Cómo probar sin molestar a los usuarios finales
• Cómo modificar el valor de una propiedad
• Cómo incluir un script JS personalizado para agregar una lógica personalizada
• Cómo incluir una clase CSS personalizada para anular los estilos estándar

Encontrará tales ejemplos en el siguiente repositorio de Github:

Personalizar la página de inicio de sesión de SAP Fiori

Convertirse en un gurú de SAP Fiori para SAP S/4HANA

Encontrarás mucho más en el página de temas de la comunidad para SAP Fiori para SAP S/4HANA

Otros enlaces útiles en la comunidad SAP:

Presentado por SAP S/4HANA Customer Care y RIG.