tlan.info
Customizar StoreFront 3.x en Citrix XenDesktop 7.8 (II)
Enero 2018 | Luis Ruiz
Continuamos con el segundo artículo para la personalización de Citrix StoreFront 3.x, en esta segunda entrega realizaremos los siguientes pasos:
- Colocaremos un segundo “Disclaimer” encima del dialogo de texto “Nombre de Usuario”.
- Renombrar Pagina Web de StoreFront.
- Cambiar icono Pagina Web StoreFront.
- Cambiar imagen de background durante la carga.
- Cambiar color de background durante la carga.
- Sustituir Logo Citrix Receiver por el corporativo, durante la carga.
** AVISO **
Acordaros de Copiar las nuevas imágenes en C: \ inetpub \ wwwroot \ Citrix \ <StoreName> Web \ custom \ .
Si tenéis varios StoreFornt programar los cambios en todos los servidores secundarios utilizando la función de propagación de StoreFront o copiar el contenido de la carpeta personalizada a todos los servidores.
Customizar StoreFront 3.x (II)
En artículo anterior, os deje el código para poner un “Disclaimer” encima del campo de Usuario., pues bien aquí vemos el ejemplo siguiendo los Pasos 1-4 y como resultado el Paso 5, esta vez he puesto el color del texto en amarillo, para diferenciarlo del anterior, como observación, poner los dos textos no queda muy “bonito”, pero así sabéis que existen dos opciones de posicionamiento.
Introduciremos el código en los ficheros style.css y script.js
Paso 1: Nos situamos en la carpeta ..\custom y abrimos con el bloc de notas el fichero style.css.
Paso 2: Escribimos el siguiente código al final del documento y guardamos el fichero.
Paso 3: Nos situamos en la carpeta ..\custom y abrimos con el bloc de notas el fichero script.js.
Paso 4: Escribimos el siguiente código al final del documento y guardamos el fichero.
Paso 5: Resultado final, ahora disponemos de dos "Disclaimer", parte superior e inferior.
Seguidamente vamos a modificar el nombre de la web, cambiando el que viene por defecto “Citrix Receiver” por el que nosotros queramos, para eso seguiremos los Pasos 6-7 y veremos el resultado en el Paso 9.
También cambiaremos la imagen de la web , no es necesario que sea un .ico, en nuestro caso he creado una nueva imagen .png de 16x16px. Pasos 10-11 y como resultado el Paso 12.
Paso 6: Nos situamos en la carpeta ..\custom y abrimos con el bloc de notas el fichero strings.en.js .
Paso 7: Modificamos el código, sustituyendo "Example1" por "AppStore" y seguidamente el texto a mostrar en la web.
Paso 8: Texto por defecto (Antes).
Paso 9: Texto modificado (Después).
Paso 10: Nos situamos en la carpeta ..\custom y abrimos con el bloc de notas el fichero script.js
Paso 11: Escribimos el siguiente código al final del documento y guardamos el fichero.
Paso 12: Como podeis observar en la imagen el icono de Citrix Receiver ha sido sustituido por nuestro logo corporativo, con una resolución de 16x16px.
A continuación vamos a personalizar la precarga en el siguiente orden como os muestro en el Paso 14, modificando el fichero "..\style.css" y añadiendo las siguientes lineas.
- Modificamos el background por defecto.
- Modificamos el color de fondo.
- Cambiamos el Logo por defecto de Citrix Receiver por el seleccionado por nosotros.
El Paso 15 os muestra la pantalla por defecto de Citrix Receiver y el Paso 16, el resultado final.
Paso 13: Nos situamos en la carpeta ..\custom y abrimos con el bloc de notas el fichero style.css.
Paso 14: Añadimos las siguientes líneas de código al final del fichero.
Paso 15: Background y logo (Antes) de la personalización.
Paso 16: Background y logo (Después) de la personalización.
Versión para imprimir