An article by sbarnes from Riverlite
During the last few months I had to do several searches on how to customize our cloud VDI POC portal. This article will explain the many steps that we used to create and edit a new WI 5.4 finished article.
I know the new CloudGatway express is out… I will post the code changes as soon as I get more info. Seems some web developers from Citrix will putting a good guideline soon
Before:
Before Customization
After:
After customization
Section 1 – the logon page
This area is the first thing that users will see, so it needs to look as good as possible, but still be functional. We opted for an all white theme and keeping the centre logon area in-tact, including the images of the various devices. This mean that we now needed to pick apart everything else that needed changing:
1. Page Title
By default the logon page has a title of “Citrix XenApp”, we decided to change this to a custom string (Riverlite vCloud). This text can be found in:
“C:\Program Files (x86)\Citrix\Web Interface\5.4.0\languages\common_strings.properties” at lines 7 and 8:
2. Header Graphic
By default the web interface will show a “Citrix XenApp” or “Citrix XenDesktop” logo (dependent on which product installed WI), we had an in-house PhotoShop expert adjust our Riverlite vCloud logo to a total white background and make the image a decent size (opted for 454×60) in preparation for the change over. Although we could edit the config files to direct WI to load an alternative image we opted for just renaming the image to the same name as the original image, this ensures less complexity and also less likely for Citrix support to ever say that the configuration is not supported in the event of a support call. The header logo is:
“C:\inetpub\wwwroot\Citrix\SiteName\media\CitrixXenApp.png” (or XenDesktop.png depending on product)
To facilitate the change I renamed CitrixXenApp.png to CitrixXenApp_OLD.png and then dropped our image in as CitrixXenApp.png.
3. Log on box text
As standard the log on box displays the phrase “log on”, this was changed to “Riverlite vCloud” by using the following steps within the Web Interface Management console:
Find the XenApp Web Site
Right click it and select “Web site appearance”
Click “Content”
Click “add” and select the correct language
Tick the “logon screen text” box
Enter your desired text in the “title” section
4. Slogan
Citrix add “Your Windows desktops and apps on demand – from any PC, Mac, smartphone or tablet” as a slogan, however as our vCloud solution is about more than this we decided to remove this. This can either be customized or removed, customize the text by editing “C:\Program Files (x86)\Citrix\Web Interface\5.4.0\languages\accessplatform_strings.properties” at line 29:
Removal can be achieved by editing “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc” at line 1179 and changing this to “display: none;”.
5. Footer Images
By default Citrix add Citrix and HDX logos to the footer of the page, to replace them with custom branding I replaced “C:\inetpub\wwwroot\Citrix\SiteName\media\CitrixWatermark.png” with my new logo. This logo has a hyperlink attached to it which can be edited in “C:\inetpub\wwwroot\Citrix\SiteName\app_code\PagesJava\com\citrix\wi\controls\FooterControl.java” at line 16
Removing the HDX logo can be achieved by editing “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc” and changing line 886 to have a value of “display: none;”.
6. Changing the background colour
By default the background is made up of a handful of images, however we decided that it would be better to utilise standard hex colors. The background is referenced in:
“C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc”
By default the top pane uses the image “HorizonBgTop.png” and the bottom pane uses “HorizonBgBottom.png”. To utilise colors instead the following configuration change was made:
Section 2 – the applications/desktops page
Once the user has authenticated they will be presented with their available applications and/or desktops. We decided that as this page will be used for demonstration purposes by large numbers of users that we should make it as clean and simple as possible. We decided to again implement some custom branding, but also remove the “messages” and “settings” options. Here is the original heading layout and the original header logo:
And here is the after:
1. Replacing the header logo
Again we had to use some PhotoShop expertise to get the color matching correct (the default WI header background is #95A2AC – as defined in “c:\inetpub\wwwroot\Citrix\SiteName\app_code\PagesJava\com\citrix\wi\pageutils\Branding.java”). The image that needs replacing is:
“C:\inetpub\wwwroot\Citrix\SiteName\media\CitrixLogoHeader.png”
2. Removing the “messages” option
Open “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\header.inc” and change line 62 as per the below to comment out the configuration item. Ensure that the change is made at both the open and close tags as highlighted below.
3. Removing the “settings” option
Open “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\header.inc” and change line 81 as per the below to comment out the configuration item. Ensure that the change is made at both the open and close tags as highlighted below.
Section 3 – the logged off page
The logged out page uses a different set of logos and configuration entries, as such a separate set of customizations is required.
Before:
After:
1. Changing the header graphic
We utilized the same header logo that is used on the logon page by simply copying and renaming the file to:
“C:\inetpub\wwwroot\Citrix\SiteName\media\CitrixXenAppLoggedOff.png”
2. Changing the footer graphic
We utilized the same footer logo that is used on the logon page by simply copying and renaming the file to:
“C:\inetpub\wwwroot\Citrix\SiteName\media\CitrixLogoDarkLoggedOff.png”
3. Customizing the background color
We decided to keep a clean white theme throughout the site, but keep the greyed out devices picture. This configuration is stored in:
“C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc”
Before:
Changing the background values to “#000000″ will provide a white background, as per the below:
Section 4 – Other useful adjustments
1. Favicons
By default a Citrix favicon is utilized:
This can be changed by placing an icon (16×16 size) with the filename of:
“C:\inetpub\wwwroot\Citrix\SiteName\media\IcaComboAll.ico”
2. Removing the “devices” image from the logon page
Browse to “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc”
Change line 1184 to set the background to “none”
3. Remove the devices image from the logged off page
Browse to “C:\inetpub\wwwroot\Citrix\SiteName\app_data\include\fullstyle.inc”
Change line 1209 to set the background to “none”