| | 0

Branding auf StoreFront und NetScaler Gateway

Mit StoreFront 3.5 und NetScaler 11.x ist es wieder einfacher geworden, die Startseiten des Receiver for Web einzurichten und den Anforderungen an das Corporate Identity zu genügen, indem die Portale für externe und interne Anmeldungen angeglichen werden.

Für die externe Erscheinung des Portals wird auf dem NetScaler im Menüpunkt NetScaler Gateway\Portal Themes ein neues Theme angelegt.

Dort unter Common Attributes werden dann die für die Optik entscheidenden jpg/png Dateien eingebunden. Diese werden nach dem Erzeugen des Themes mittels geeignetem scp/filezilla etc in den Ordner /var/netscaler/logon/themes/<ThemeName>/custom_media kopiert.

Die Bilddateien werden natürlich auch auf dem StoreFront benötigt. Sie werden auf dem primären Server der Servergruppe in das Verzeichnis C:\inetpub\wwwroot\Citrix\<StoreName>Web\custom kopiert. Die Synchronisation der Dateien innerhalb des custom Verzeichnisses erfolgt mittels Synchronisation der Servergruppe.

Wie bei den Vorgängerversionen haben es leider weiterhin nicht alle Einstellungen in die GUI geschafft. Auf der StoreFront (3.5) Seite muss nur noch an einer Stelle „gehackt“ werden, nämlich in der style.css im Pfad der Webseite. Hier muss weiterhin der Pfad zum Hintergrundbild angeben werden.

Des Weiteren werden noch ein paar Einstellungen im Store vorgenommen:

Store -> Receiver für Web-Seiten verwalten -> Konfigurieren -> Benutzeroberfläche anpassen

Es werden 2 Logos in unterschiedlicher Auflösung benötigt. Die maximale Größe der Bilddateien wird im Dialog angezeigt. Die Files werden der Einfachheit halber im Custom Verzeichnis der Webseite unter C:\inetpub\wwwroot\Citrix\<StoreName>Web\custom abgelegt.

Im gleichen Pfad muss auch das Hintergrundbild, welches nicht über den Dialog eingebunden werden kann, abgelegt werden.

Nun muss die style.css angepasst werden. Die Referenzierung des Hintergrundbildes duldet offenbar keinen absoluten Pfad, deshalb: Gleiches Verzeichnis.

1

2

3

4

5

/* CITRIX DISCLAIMER: END OF MANAGED SECTION. */

/* You may add custom styles below this line. */

.web-screen{

    background-image: url(‘sepago_bg_2000x1125.jpg’);

}

Damit ergibt sich dann sowohl bei einer Anmeldung von Außen, als auch von Innen das gleiche Bild.

Danke an meinen Kollegen Jens Röbenack, der hier wesentlichen Input geliefert hat.



Quellen:

Storefront 3.0, aber korrekt bezgl der css syntax:

https://www.citrix.com/blogs/2015/09/04/storefront-3-web-customization-branding-your-deployment/

Desweiteren

http://www.carlstalhood.com/storefront-3-5-tweaks/#netscaler11