Ejemplo: personalizaciones de la página de inicio de sesión para Process Portal

Puede personalizar una serie de elementos distintos de la página de inicio de sesión como, por ejemplo, los gráficos, el color de fondo y las etiquetas del campo de inicio de sesión.

Estilos de página de inicio de sesión

La tabla siguiente proporciona descripciones de los estilos que puede definir para la página de inicio de sesión.

Estilo	Atributo	Descripción
`.topDiv`	`background-image: url`	Identifica la imagen utilizada como fondo general que rodea al área de inicio de sesión.
`.login-bg` o `mumrtl .login-bg`	`background-image: url`	Identifica la imagen que se utiliza como fondo del área de inicio de sesión que contiene los campos de inicio de sesión. Si cambia su tamaño, es posible que deba ajustar el archivo login.css como corresponda. El valor mumrtl .login-bg es para los idiomas de derecha a izquierda como el árabe o el hebreo.
`.login-top-spacer`		Establece el espacio mínimo sobre los campos de inicio de sesión.
`.login-copyright`		Establece el color y la ubicación del texto de copyright.
`.loginText`		Establece la apariencia de las etiquetas para los campos de inicio de sesión ID de usuario y Contraseña.

El aspecto de la página de inicio de sesión lo controla la siguiente sección del archivo login.css:

.topDiv {
height: 100%;
font: 300 11px Arial, Verdana, Geneva, Helvetica, sans-serif;
color: #ffffff;
background-image: url(images/login-page-bg.jpg);
background-position: center;
}

Los ejemplos siguientes describen cómo puede personalizar el fondo para sus propios espacios.

Imagen de bienvenida de la página de inicio de sesión

La imagen de bienvenida es la imagen detrás de los campos de texto de nombre de usuario y contraseña que utiliza el estilo predeterminado. Esto lo controla la siguiente regla en el archivo login.css:

.login-bg {
background-image: url(images/login-bg.png);
background-repeat: no-repeat;
height: 428px;
width: 579px;
}

Puede añadir una nueva imagen a la carpeta images y actualizar la regla de imagen de fondo para que apunte en su lugar a esta nueva imagen.

Nota: Si el navegador está definido para utilizar un entorno local para un idioma de derecha a izquierda como el árabe o el hebreo, se aplica una regla diferente que alinea el nombre y el logotipo a la derecha de la página. Para mostrar una versión alineada a la derecha de la página de inicio de sesión personalizada, proporcione una imagen alternativa y actualice la siguiente regla de imagen de fondo para apuntar a esta nueva imagen.

.mumrtl .login-bg {
background-image: url(images/login-bg-bidi.png);
}

Para visualizar la misma imagen independientemente del idioma del navegador, suprima completamente la regla .mumrtl .login-bg.

Icono de acceso directo del navegador

El icono que se visualiza en el separador del navegador y en el favorito o marcador del navegador para la página de inicio de sesión es el archivo de imagen /images/WBS.ico. Puede reemplazar este archivo de icono en la carpeta personalizada para proporcionar su propio icono. Para una experiencia coherente, es posible que también desee cambiar favicon.ico en webDAV_folder/public/themes/bspaceTheme/images/favicon.ico ya que este icono se utiliza para todas las páginas cuando el usuario ha iniciado una sesión en Process Portal.

Texto de inicio de sesión

El texto utilizado para etiquetar los campos de nombre de usuario y contraseña lo controla la siguiente regla CSS:

 .loginText {
color: #FFFFFF;
font-family: Arial,Verdana,Helvetica,sans-serif;
font-size: 12px;
font-weight: bold;
}

El tipo de font, tamaño y color se puede modificar cambiando estas propiedades.

Nota: Los recuadros de texto de los campos de nombre de usuario y contraseña y el botón de inicio de sesión no son personalizables. Por motivos legales, la información de copyright y el logotipo de IBM no se deben personalizar u ocultar.