Os dejo un documento bastante sencillote de how en unos pocos minutos que le dediquemos, podremo darle una nuova cara a nostro portal de applicazioni o escritorios de Citrix, nuestro querido StoreFront! Es muy facile y muy agradecido por nuestros utenti el fare un portal corporativo chulo! Y si los utenti no nos lo agradecen, Sabemos que los directivos sí 😉

En este documento nos basamos en modificar un StoreFront 3.5, pero podríamos usarlo para qualsiasi versione de la 3.x. E se non lo è, siempre os recomendaré la forma que hago yo para saber qué y donde modificar, seguro que alguno lo hace más fácil, pero yo utilizo una extension del Firefox llamada Firebug. Dedicarle un par de minutos y ya veréis qué fácil es modificar una web para saber qué tocar luego en los ficheros 'reales'.

Este sería un ejemplo de un portal personalizado, usando nuestra imagen de corporativa:

Si queremos tener un interface como el de la imagen, donde podamos cambiare los logos, los colores del texto/botones, el fondo… podremo seguire los siguientes passi y en unos pochi minuti lo tendremos!!

Imagen de fondo

Bastará con sustituir el fichero ‘C:\inetpub\wwwroot\Citrix\StoreWeb\receiver\images\common\ReceiverFullScreenBackground_46E559C0E6B5A27B.jpg’ por el fondo que queramos, recomendable será por tanto mantener el mismo tamaño de imagen y dotarla de buena calidad.

Color de los botones

Para cambiar el color del botón “Accedi” o cualquier otro que el usuario reciba, en el fichero “C:\inetpub\wwwroot\Citrix\StoreWeb\receiver\css\ctxs.large-ui.min_77F67A01D0A24AF1.css” reemplazaremos los #02a1c1 por nuestro color corporativo.

Colores de textos

Si queremos cambiar el texto de ‘Usuario/Contraseña’, en el mismo fichero reemplazaremos la línea ‘.plain{margin-left:0;colore: #9a9a9a;dimensione-carattere:17Px;peso del carattere:300;line-height:44Px}.credentialform’ por el tipo y color de letra que deseemos.

Para cambiar el color de la letra activa en los campos de texto, cambiaremos en ‘.credentialform input[type=password]:focus{colore:nero}.credentialform’ el color que nos interese, sustituyendo el ‘black’.

Para cambiar el color de la letra inactiva en los campos de texto, cambiaremos en ‘.pseudo-input{box-sizing:border-box;Larghezza:385Px;altezza:44Px;outline:0;Confine:0;colore di sfondo:bianco;dimensione-carattere:16Px;colore:#666}.credentialform’ cambiando el ‘#666’ por el color que deseemos (normalmente será un tono más oscuro que el anterior).

Cambiando el tamaño del Logo,

Ya sabemos que los logotipos los meteremos desde la consola Studio, más abajo tenéis la imagen para personalizar ‘Receiver para Web’. Ma, para cambiar el tamaño del Logo inicial y poner un logo más grande del que nos deja la consola de Citrix StoreFront, modificheremo in ‘C:\inetpub\wwwroot\Citrix\StoreWeb\custom’ el fichero ‘style.css’ cambiando los tamaños que nos interese, oltre a inserire le immagini necessarie con tale risoluzione in questo stesso percorso. Sostituiamo le dimensioni nel CSS:

.logo-container{

immagine di sfondo: URL(‘Citrix_HalfHeaderLogo.png’);

dimensione dello sfondo: 170px 40px;

}

.is-hdpi .logon-logo-container{

immagine di sfondo: URL(‘logo-tun-350-120.png’);

dimensione dello sfondo: 175px 60px;

}

Traccia orizzontale

Per cambiare il colore della traccia grigia che ha trasparenza e che ci copre lo schermo da sinistra a destra, modificheremo in “C:\inetpub\wwwroot\Citrix\StoreWeb\receiver\css\ctxs.large-ui.min_77F67A01D0A24AF1.css” el código con nuestro color y el % trasparenza in: ’background-color:RGBA(63,54,67,0.8);allineamento del testo:center}.web-screen’.

Customizzando dalla console

Questo lo conosciamo già, che dalla console di StoreFront, sul nostro sito Web potremo cambiare il tema del portale con uno che ci rappresenti di più, poiché “Personalizzare aspetto” potremo cambiare i loghi, quello prima dell'accesso, quello dopo aver effettuato l'accesso, il colore dello sfondo, il colore dei testi, il colore dei link…

E questo sarebbe l'aspetto del nostro nuovo portale di applicazioni!!! Certo, sicuramente voi avete più gusto di me 😉